jQuery duyệt - phương thức children()
Thực thể
Tìm tất cả các phần tử con của div có tên lớp "selected" và đặt chúng thành màu xanh lam:
$("div").children(".selected").css("color", "blue");
Định nghĩa và cách sử dụng
Phương pháp .children() trả về tất cả các yếu tố con trực tiếp của yếu tố được chọn.
Ngữ pháp
.children(selector)
| Tham số | Mô tả |
|---|---|
| selector | Giá trị chuỗi, chứa biểu thức chọn lựa phù hợp với yếu tố. |
Mô tả chi tiết
Nếu cung cấp đối tượng jQuery đại diện cho bộ sưu tập yếu tố DOM, phương pháp .children() cho phép chúng ta truy xuất các yếu tố đó trong cây DOM và xây dựng lại đối tượng jQuery mới từ các yếu tố phù hợp..find() Giống như phương pháp .children(), nhưng后者 chỉ duyệt theo cây DOM một cấp.
Lưu ý rằng, giống như hầu hết các phương pháp jQuery, .children() không trả về các nút văn bản; nếu cần lấy tất cả các yếu tố con bao gồm cả các nút văn bản và chú thích, hãy sử dụng .contents().
Phương pháp này chấp nhận một biểu thức chọn lựa làm tham số tùy chọn, tương tự như loại của các tham số được truyền vào $(). Nếu áp dụng biểu thức chọn lựa, nó sẽ kiểm tra yếu tố có khớp với biểu thức này không, từ đó lọc những yếu tố đó.
Hãy suy nghĩ về trang web này với danh sách đệm cơ bản:
<ul class="level-1">
<li class="item-i">I</li>
<li class="item-ii">II
<ul class="level-2">
<li class="item-a">A</li>
<li class="item-b">B
<ul class="level-3">
<li class="item-1">1</li>
<li class="item-2">2</li>
<li class="item-3">3</li>
</ul>
</li>
<li class="item-c">C</li>
</ul>
</li>
<li class="item-iii">III</li>
</ul>
Nếu chúng ta bắt đầu từ danh sách level-2, chúng ta có thể tìm thấy các yếu tố con của nó:
$('ul.level-2').children().css('background-color', 'red');
Kết quả của dòng mã này là, các mục A, B, C nhận được nền màu đỏ. Do chúng ta không áp dụng biểu thức chọn lựa, đối tượng jQuery trả về chứa tất cả các yếu tố con. Nếu áp dụng một biểu thức chọn lựa, chỉ bao gồm các mục phù hợp.
