Làm thế nào để tìm thấy yếu tố phụ huynh đầu tiên trong jquery

Question

Conside dưới html -

<div class="container1"> 
    <div class="container2"> 
     <div class="container3"> 
     <div class="container4"> 
      <div class="element"> 
      ... 
     </div> 
     </div> 
    </div> 
</div> 

nếu tôi muốn nhận được <div class="element"> yếu tố và tôi có tham chiếu đến container1. Trong jquery những gì tôi làm là,

$(".container1").find(".element") 

thay vì -

$(".container1").children().children().children().find(".element") 

Đây là quá trình để tìm thấy bất kỳ phần tử con khi tôi có tham chiếu đến bất kỳ yếu tố phụ huynh. Nhưng thay vào đó khi tôi có tham chiếu đến một phần tử con và muốn có được yếu tố phụ huynh sau đó mỗi khi tôi phải đi một bậc lên -

$(".element").parent().parent().parent().parent() 

và tôi không thể làm như thế này -

$(".element").findParent() 

Tôi đã không đi qua bất kỳ phương pháp như findParent() trong jquery. Có điều gì tôi không biết? Hay là không có lý do nào đó?

Answer 1

$(".element").parents(); 

sẽ cung cấp cho tất cả phụ huynh của .element(bao gồm html và body)

DEMO

Để tìm thấy bất kỳ cha mẹ cụ thể, giả sử container1 sau đó

$('.element').parents('.container1') 

DEMO

jQuery .parents() thường tìm thấy tất cả các bậc cha mẹ, nhưng nếu bạn đã thông qua một selector thì nó sẽ tìm kiếm điều đó.

Answer 2

chỉ cần sử dụng

$(".element").closest('#container1'); 

nếu không có tổ tiên với id được tìm thấy sau đó

$(".element").closest('#container1').length sẽ 0

Answer 3

Để có được phụ huynh đầu tiên cá nhân tôi sử dụng xây dựng sau đây:

var count_parents = $(".element").parents().length; 
$(".element").parents().eq(count_parents - 1); 

Hope, nó sẽ rất hữu ích cho một ai đó.