- *
- tag
- .class
- #id
- selector01, selector02, selectorN
- parent > child
- :eq()
- :gt()
- :lt()
- :even
- :odd
- :first
- :last
- :first-child
- :first-of-type
- :last-child
- :last-of-type
- :nth-child(n)
- :nth-last-child(n)
- :nth-of-type(n)
- :nth-last-of-type(n)
- :only-child
- :only-of-type
- :animated
- [attribute]
- [attribute="value"]
- [attribute!="value"]
- [attribute|="value"]
- [attribute^="value"]
- [attribute$="value"]
- [attribute*="value"]
- [attribute~="value"]
- :lang(language)
- [bộ chọn thuộc tính 1][bộ chọn thuộc tính n]
- :parent
- :empty
- :text
- :button
- :checkbox
- :checked
- :disabled
- :enabled
- :file
- :focus
- :hidden
- :image
- :input
- :password
- :radio
- :reset
- :selected
- :submit
- :visible
- :root
- :has(selector)
- :header
- ("prev + next")
- ("prev + siblings")
- (":not(selector)")
- :contains(text)
:eq()
Đăng bởi: Admin
Định nghĩa và sử dụng
- Bộ chọn :eq(n): chọn thành phần với một chỉ số n cụ thể.
- :eq(0) sẽ chọn phần tử đầu tiên.
Cấu trúc
- Đã được thêm vào từ phiên bản 1.0
$(':eq(n)')
- Đã được thêm vào từ phiên bản 1.8
$(':eq(-n)')
Ví dụ
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(){ $('ul li:eq(3)').css('border','1px solid blue'); }); </script> </head> <body> <ul> <li>li thứ nhất</li> <li>li thứ hai</li> <li>li thứ ba</li> <li>li thứ tư</li> <li>li thứ năm</li> </ul> </body> </html>
Hiển thị trình duyệt:
$('ul li:eq(3)') chọn phần tử li thứ 3.
Ví dụ
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(){ $('ul li:eq(-3)').css('border','1px solid blue'); }); </script> </head> <body> <ul> <li>li 0</li> <li>li 1</li> <li>li 2</li> <li>li 3</li> <li>li 4</li> </ul> </body> </html>
Hiển thị trình duyệt:
$('ul li:eq(3)') chọn phần tử li thứ 3 tính từ cuối danh sách.
Theo dõi VnCoder trên Facebook, để cập nhật những bài viết, tin tức và khoá học mới nhất!