javascript - 如何使用jQuery在html中获取div的祖 parent 的祖 parent

Question

有没有更好的方法来获取父项的父项的父项...比如 5 次？

所以不用这个:

$(this).parent().parent().parent().parent().parent()

我可以使用这样的东西:

$(this).goBacktoNthParent(5);

这可能吗？

Answer 1

使用 :eq() 选择器

:eq() 选择器允许您将元素定位到匹配集合的从零开始的索引处...

$(this).parents(':eq(4)')

注意:使用父级选择器

因为选择器是从零开始的，所以我们给它的数字比目标数字少一。

演示: http://jsfiddle.net/pmMFv/

---

使用 .eq() 方法

.eq() 方法实际上与其对应的选择器相同，允许您将元素定位到匹配集合的从零开始的索引处...

$(this).parents().eq(4)

注意:使用父级选择器

演示: http://jsfiddle.net/pmMFv/2/

---

在循环中使用parentNode

为了获得最佳性能，我们可以使用元素的 .parentNode 属性，并在循环中运行它，每次都使用最新的父节点更新变量...

var el = this, i = 5;
while(i-- && (el = el.parentNode));

$(el)

演示: http://jsfiddle.net/pmMFv/1/