Bộ chọn :nth-last-child() Selector trong jQuery có cú pháp như thế nào? và được sử dụng trong trường hợp nào. Cùng tìm hiểu và xem qua theo ví dụ cụ thể
Cú pháp, Định nghĩa và cách sử dụng jQuery :nth-last-child() Selector
Syntax
Bộ chọn jQuery :nth-last-child() Selector có cú pháp
$(":nth-last-child(n|even|odd|formula)")
Tham số | Mô tả |
---|---|
n | Chọn phần tử có chỉ số thứ tự là n. Trong đó n phải là số và phần tử con cuối cùng có n=1 |
even | Chọn những phần tử con chẵn |
odd | Chọn những phần tử con lẻ |
formula | Chọn các phần tử con theo công thức (an + b).
Ví dụ: p:nth-last-child(3n + 2) chọn mỗi đoạn thứ 3, bắt đầu từ phần tử con thứ 2 từ dưới đếm lên |
:nth-last-child(n)
Selector dùng để chọn tất cả phần tử là con thứ n của cha mẹ chúng tính từ phần tử con cuối cùng trở ngược lên, không cần phân biệt loại, hay thuộc tính nào của mọi phần tửMẹo:
Để chọn những phần tử con theo thứ tự từ dưới lên trên của một loại cụ thể, chúng ta sử dụng bộ chọn
:nth-last-of-type()
ví dụ jQuery :nth-last-child() Selector
Ví dụ
Chọn những phần tử<p>
là phần tử con thứ 3 của cha mẹ chúng tính từ dưới lên (từ phần tử con cuối cùng trở ngược lại)
$("p:nth-last-child(3)")
Ví dụ
Sử dụng công thức (an + b) để chọn những phần tử con khác nhau tính từ dưới lên.Chọn những phần từ con là p tính từ dưới lên theo thứ tụ 2, 5, 8 theo công thức (3n+2)
$("p:nth-last-child(3n+2)")
Ví dụ
Sử dụng even hoặc odd để chọn những phần tử con khác nhau, được tính từ phần tử cuối cùng trở lên.
$("p:nth-last-child(even)")
$("p:nth-last-child(odd)")
Ví dụ
Sự khác nhau giữa:nth-child()
, :nth-last-child()
, :nth-of-type()
và :nth-of-last-type()
$("p:nth-child(2)")
$("p:nth-last-child(2)")
$("p:nth-of-type(2)")
$("p:nth-last-of-type(2)")
Xem thêm bài viết Tất cả bộ chọn jQuery Selectors tại đây