.eq() | Hàm JQuery | Tham Khảo JQuery | Học Web Chuẩn
Có thể bạn quan tâm
- Trang chủ
- Tham khảo
- jQuery
- jQuery - function
- .eq()
Định nghĩa và sử dụng
- .eq(n): Xác định thành phần ở vị trí thứ n.
- Trong đó n có thể mang giá trị âm.
- .eq(0) ứng với thành phần ở vị trí đầu tiên.
- .eq(-1) ứng với thành phần ở vị trí cuối cùng.
Cấu trúc
- Đã được thêm vào từ phiên bản 1.1.2
.eq(n)
$('li').eq(3);- Đã được thêm vào từ phiên bản 1.4
.eq(-n)
$('li').eq(-2);.eq(n)
Html viết:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Tiêu đề</title> <script src="https://code.jquery.com/jquery-latest.js"></script> <script> $(function(){ $('li').eq(3).css('background-color','yellow'); }); </script> </head> <body> <ul> <li>Thành phần thứ 1</li> <li>Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li>Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> </body> </html>Hiển thị trình duyệt:
Ta thấy Thành phần thứ 4 đã được xác định, vì .eq(0) ứng với vị trí Thành phần thứ 1 cho nên .eq(3) sẽ ứng với Thành phần thứ 4.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
|---|---|
<ul> <li>Thành phần thứ 1</li> <li>Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li>Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> | <ul> <li>Thành phần thứ 1</li> <li>Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li style="background-color: yellow;">Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> |
.eq(-n)
Html viết:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Tiêu đề</title> <script src="https://code.jquery.com/jquery-latest.js"></script> <script> $(function(){ $('li').eq(-4).css('background-color','yellow'); }); </script> </head> <body> <ul> <li>Thành phần thứ 1</li> <li>Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li>Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> </body> </html>Hiển thị trình duyệt:
Ta thấy Thành phần thứ 2 đã được xác định, vì .eq(-1) sẽ ứng với vị trí cuối cùng tức là Thành phần thứ 5, do đó .eq(-4) sẽ ứng với Thành phần thứ 2.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
|---|---|
<ul> <li>Thành phần thứ 1</li> <li>Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li>Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> | <ul> <li>Thành phần thứ 1</li> <li style="background-color: yellow;">Thành phần thứ 2</li> <li>Thành phần thứ 3</li> <li>Thành phần thứ 4</li> <li>Thành phần thứ 5</li> </ul> |
.end()
.error()
HTML & XHTML
HƯỚNG DẪN HỌC
- Hướng dẫn học
- Hướng dẫn học XHTML & HTML5
- Hướng dẫn học CSS
- Hướng dẫn học CSS3
- Hướng dẫn học Responsive
- Hướng dẫn học ES6
- Hướng dẫn học React.js
- Hướng dẫn học jQuery
- Hướng dẫn học PHP
- Hướng dẫn học Laravel
- Hướng dẫn học Wordpress
- Hướng dẫn học Webpack
- Hướng dẫn học SCSS
THAM KHẢO
Hàm jQuery (Selectors)
- .add()
- .addBack()
- .addClass()
- .after()
- .andSelf()
- .animate()
- .append()
- .appendTo()
- .attr()
- .before()
- .bind()
- .blur()
- .change()
- .children()
- .clearQueue()
- .click()
- .clone()
- .closest()
- .contents()
- .context
- .css()
- .dblclick()
- .delay()
- .delegate()
- .dequeue()
- .detach()
- .die()
- .each()
- .empty()
- .end()
- .eq()
- .error()
- .fadeIn()
- .fadeOut()
- .fadeTo()
- .fadeToggle()
- .filter()
- .find()
- .finish()
- .first()
- .focus()
- .focusin()
- .focusout()
- .get()
- .has()
- .hasClass()
- .height()
- .hide()
- .hover()
- .html()
- .index()
- .innerHeight()
- .innerWidth()
- .insertAfter()
- .insertBefore()
- .is()
- .jquery
- .keydown()
- .keypress()
- .keyup()
- .last()
- .length
- .live()
- .load()
- .map()
- .mousedown()
- .mouseenter()
- .mouseleave()
- .mousemove()
- .mouseout()
- .mouseover()
- .mouseup()
- .next()
- .nextAll()
- .nextUntil()
- .not()
- .off()
- .offset()
- .offsetParent()
- .on()
- .one()
- .outerHeight()
- .outerWidth()
- .parent()
- .parents()
- .parentsUntil()
- .position()
- .prepend()
- .prependTo()
- .prev()
- .prevAll()
- .prevUntil()
- .remove()
- .removeAttr()
- .removeClass()
- .removeData()
- .removeProp()
- .replaceAll()
- .replaceWith()
- .resize()
- .scroll()
- .scrollLeft()
- .scrollTop()
- .select()
- .selector()
- .serialize()
- .serializeArray()
- .show()
- .siblings()
- .size()
- .slice()
- .slideDown()
- .slideToggle()
- .slideUp()
- .stop()
- .submit()
- .text()
- .toArray()
- .toggle()
- .toggleClass()
- .trigger()
- .triggerHandler()
- .unbind()
- .undelegate()
- .unload()
- .unwrap()
- .val()
- .width()
- .wrap()
- .wrapAll()
- .wrapInner()
Tham khảo CSS
- CSS - Tham khảo
- CSS - Bộ chọn (selectors)
- CSS - Thuộc tính
- CSS3 - Tham khảo
- CSS3 - Bộ chọn (selectors)
- CSS3 - Thuộc tính
- Xem thêm ví dụ về CSS
Tham khảo HTML/XHTML
- Tham khảo HTML/XHTML
- Tag theo function
- Tag theo giá trị DTD
- Tham khảo HTML4/XHTML
- Tham khảo HTML5
- Xem thêm ví dụ về HTML
Tham khảo JQUERY
- jQuery - Tham khảo
- jQuery - Cài đặt và sử dụng
- jQuery - Bộ chọn (selectors)
- jQuery - Hàm (function)
- jQuery - Ajax
Tham khảo Thêm
- Lang codes
- Font chữ
- Mã ký tự
- MIME
- Đơn vị trong HTML & CSS
- Giá trị màu trong HTML & CSS
- Thuộc tính tổng quát
CHUYÊN ĐỀ
- Chuyên đề
- Chuyên đề HTML/CSS
- Chuyên đề HTML5/CSS3
- Chuyên đề jQuery/JS
- jQuery/JS plugin
GÓP Ý - LIÊN HỆ
- BẠN SẼ TÀI TRỢ?DONATE
- CÔNG CỤ TẠO CSS3CSS3 GENERATOR
- BỘ CÔNG CỤGENERATOR TOOLS
- CÔNG CỤ HỖ TRỢWEB TOOLS
- CÔNG CỤ TẠO RANDOMRANDOM GENERATOR
- CÔNG CỤ KIỂM TRA RESPONSIVE TEST
- CHIA SẺ HAYWEB & TOOLS
Từ khóa » Eq Jquery Là Gì
-
:eq() | Tham Khảo JQuery | Học Web Chuẩn
-
.eq() Trong JQuery - Hoclaptrinh
-
Cách Dùng :eq() Selector Trong JQuery - Freetuts
-
Eq(index) Trong JQuery
-
JQuery :eq() Selector - W3Schools
-
Cách Dùng :eq() Selector Trong JQuery - NguyenGiaTech
-
Jquery — JQuery: Eq () So Với Get () - Tra-loi-cau-hoi-phat-trien
-
Sự Khác Biệt Giữa Get () Và Eq () Trong Jquery Là Gì?
-
Eq Selector - Selector Trong Jquery
-
Tương đương JS Thuần Túy Của Jquery Eq () - HelpEx
-
Eq Selector - Freetuts
-
Tìm Hiểu Về JQuery Part 4 - Viblo
-
.eq() | JQuery API Documentation
-
Jquery Traversing - Thầy Long Web


