如何使用jquery查找元素的第n个父元素

时间:2022-11-27 11:43:08

I want to find the nth parent element of an given element and access the attributes of parent.

我想找到给定元素的第n个父元素并访问parent的属性。

<div id='parent1'><br/>
  <div id='parent2'><br/>
       <span><p id='element1'>Test</p></span><br/>
  </div><br/>
  <div id='parent3'><br/>
       <span><p id='element2'>Test</p></span><br/>
  </div><br/>
</div>

I want to access the 3rd parent element of element1 without using

我想在不使用的情况下访问element1的第三个父元素

$('#element1').parent().parent().parent()

Any help would be appreciated

任何帮助,将不胜感激

4 个解决方案

#1


57  

You can use .parents() and .eq():

您可以使用.parents()和.eq():

$('#element1').parents().eq(2);

http://jsfiddle.net/infernalbadger/4YmYt/

http://jsfiddle.net/infernalbadger/4YmYt/

#2


6  

You could make a little plugin to take care of that:

你可以制作一个小插件来处理:

$.fn.nthParent = function(n){
    var p = this;
    for(var i=0;i<n;i++)
        p = p.parent();
    return p;
}

and then use it as:

然后将其用作:

$('#element1').nthParent(3);

#3


5  

parents() returns a list, so this works:

parents()返回一个列表,因此这有效:

$('#element1').parents()[2];

#4


4  

use:

使用:

$('#element1').closest('#parent1');

#1


57  

You can use .parents() and .eq():

您可以使用.parents()和.eq():

$('#element1').parents().eq(2);

http://jsfiddle.net/infernalbadger/4YmYt/

http://jsfiddle.net/infernalbadger/4YmYt/

#2


6  

You could make a little plugin to take care of that:

你可以制作一个小插件来处理:

$.fn.nthParent = function(n){
    var p = this;
    for(var i=0;i<n;i++)
        p = p.parent();
    return p;
}

and then use it as:

然后将其用作:

$('#element1').nthParent(3);

#3


5  

parents() returns a list, so this works:

parents()返回一个列表,因此这有效:

$('#element1').parents()[2];

#4


4  

use:

使用:

$('#element1').closest('#parent1');