Web Cơ Bản

Cách chọn các phần tử tổ tiên trong jQuery

Trong jQuery, có chủ yếu 3 phương thức dùng để chọn các phần tử tổ tiên.

  • Phương thức parent() - dùng để chọn phần tử cha mẹ.
  • Phương thức parents() - dùng để chọn phần tử cha mẹ, ông bà, tổ tiên,.... (nói chúng là từ cha mẹ trở lên).
  • Phương thức parentsUntil() - dùng để chọn các phần tử tổ tiên nằm bên trong một phần tử chỉ định

Phương thức parent() trong jQuery

Phương thức parent() được dùng để chọn phần tử cha mẹ.

Ví dụ 1:

Câu lệnh dưới đây sẽ chọn phần tử là cha mẹ của phần tử <span>, sau đó dùng phương thức attr() để thêm thuộc tính style với giá trị "border:5px solid red" cho phần tử đó.


$("span").parent().attr("style","border:5px solid red");
Xem ví dụ
Ví dụ 2:

Câu lệnh dưới đây sẽ chọn phần tử là cha mẹ của phần tử <span> với điều kiện phần tử cha mẹ đó phải là <li>, sau đó dùng phương thức attr() để thêm thuộc tính style với giá trị "border:5px solid red" cho phần tử đó.


$("span").parent("li").attr("style","border:5px solid red");
Xem ví dụ

Phương thức parents() trong jQuery

Phương thức parents() được dùng để chọn các phần tử cha mẹ, ông bà, tổ tiên,....

Ví dụ 1:

Câu lệnh dưới đây sẽ chọn các phần tử là tổ tiên của <span>, sau đó dùng phương thức attr() để thêm thuộc tính style với giá trị "border:1px solid red" cho phần tử đó.


$("span").parents().attr("style","border:1px solid red");
Xem ví dụ
Ví dụ 2:

Câu lệnh dưới đây sẽ chọn phần tử là cha mẹ của phần tử <span> với điều kiện phần tử cha mẹ đó phải là <li>, sau đó dùng phương thức attr() để thêm thuộc tính style với giá trị "border:5px solid red" cho phần tử đó.


$("span").parent("li").attr("style","border:5px solid red");
Xem ví dụ