nút tổ tiên gần nhất trong jQuery

Question

Trong kinh nghiệm javascript của tôi, tôi thấy đó là một nhiệm vụ rất phổ biến "tìm kiếm tổ tiên gần nhất của một phần tử với một số điều kiện (tên thẻ, lớp, ...)". Phương thức jquery của cha mẹ có thể thực hiện công việc không? Thứ tự của các yếu tố được trả về của cha mẹ() có thể dự đoán được? Là từ đầu đến cuối hay từ dưới lên trên? Hiện tại tôi sử dụng chức năng tiện ích này:

function ancestor(elem, selector) { 
    var $elem = $(elem).parent(); 
    while($elem.size() > 0) { 
    if($elem.is(selector)) 
    return $elem; 
    else 
     $elem = $elem.parent(); 
    } 
    return null; 
} 

Ai đó có thể cho tôi biết nếu có cách thông minh để thực hiện công việc?

Answer 1

Chỉnh sửa: Kể từ jQuery 1.3, điều này đã được tích hợp dưới dạng hàm closest(). ví dụ: $('#foo').closest('.bar');

---

yep - cha mẹ() đi qua cây.

<div id="a"> 
    <div id="b"> 
     <p id="c"> 
      <a id="d"></a> 
     </p> 
    </div> 
</div> 

$('#d').parents("div:first"); sẽ chọn div b.

Answer 2

Thêm vào câu trả lời @nickf 's:

jQuery 1.3 simplifyed nhiệm vụ này với closest.

Cho một DOM:

<div id="a"> 
    <div id="b"> 
     <p id="c"> 
      <a id="d"></a> 
     </p> 
    </div> 
</div> 

Bạn có thể làm:

$('#d').closest("div"); // returns [ div#b ] 

[Closest lợi nhuận a] bộ yếu tố có chứa các yếu tố phụ huynh gần nhất mà phù hợp với quy định selector, phần tử bắt đầu được bao gồm.

Answer 3

Bạn nên sử dụng closest, vì parents sẽ không cung cấp cho bạn những kết quả mà bạn mong đợi nếu bạn đang làm việc với nhiều yếu tố. Ví dụ, giả sử bạn có điều này:

<div id="0"> 
     <div id="1">test with <b>nested</b> divs.</div> 
     <div id="2">another div.</div> 
     <div id="3">yet <b>another</b> div.</div> 
    </div> 

và bạn muốn thêm một lớp học để các divs rằng có một yếu tố <b> như con trực tiếp của mình (ví dụ, 1 và 3). Nếu bạn sử dụng $('b').parents('div'), bạn nhận được số div 0, 1 và 3. Nếu bạn sử dụng $('b').parents('div:first'), bạn chỉ nhận được div 1. Để nhận được 1 và 3, nhưng không phải 0, bạn phải sử dụng $('b').closest(elem).

Answer 4

gần nhất() bắt đầu từ yếu tố hiện tại, nếu phụ huynh bạn đang tìm kiếm có thẻ giống như hiện tại (ví dụ. Cả hai đều divs), sử dụng cha mẹ(). Gần nhất()