Truy vấn - Cổ tổ

Phần tử bậc cao là cha, ông, cụ, v.v.

Bằng jQuery, bạn có thể duyệt lên cây DOM để tìm kiếm phần tử bậc cao.

Duyệt lên cây DOM

Những phương thức jQuery này rất hữu ích, chúng được sử dụng để duyệt lên cây DOM:

  • parent()
  • parents()
  • parentsUntil()

Phương thức jQuery parent()

Phương thức parent() trả về phần tử cha trực tiếp của phần tử được chọn.

Phương thức này chỉ duyệt lên một cấp trên cây DOM.

Dưới đây là ví dụ để trả về phần tử cha trực tiếp của mỗi phần tử <span>:

Mô hình

$("document").ready(function(){
  $("span").parent();
});

Thử ngay

Phương thức jQuery parents()

Phương thức parents() trả về tất cả các phần tử bậc cao của phần tử được chọn, nó đi lên cho đến phần tử gốc của tài liệu (<html>).

Dưới đây là ví dụ để trả về tất cả các phần tử bậc cao của tất cả các phần tử <span>:

Mô hình

$("document").ready(function(){
  $("span").parents();
});

Thử ngay

Bạn cũng có thể sử dụng tham số tùy chọn để lọc việc tìm kiếm các phần tử bậc cao.

Dưới đây là ví dụ để trả về tất cả các phần tử bậc cao của phần tử <span> và nó là phần tử <ul>:

Mô hình

$("document").ready(function(){
  $("span").parents("ul");
});

Thử ngay

Phương thức jQuery parentsUntil()

Phương thức parentsUntil() trả về tất cả các phần tử bậc cao giữa hai phần tử được chỉ định.

Dưới đây là ví dụ để trả về tất cả các phần tử bậc cao giữa <span> và phần tử <div>:

Mô hình

$("document").ready(function(){
  $("span").parentsUntil("div");
});

Thử ngay

Hướng dẫn tham khảo jQuery duyệt

Nếu bạn muốn biết tất cả các phương pháp duyệt jQuery, hãy truy cập Hướng dẫn tham khảo jQuery duyệt。