15

在我的 javascript 经验中,我发现这是一个非常常见的任务“搜索具有某种条件的元素的最近祖先(标签名称,类,...)”。jquery 的 parents() 方法可以完成这项工作吗?parents() 的返回元素的顺序是可预测的吗?是自上而下还是自下而上?目前我使用这个实用功能:

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

有人能告诉我是否有一种聪明的方法来完成这项工作吗?

4

4 回答 4

21

编辑:自 jQuery 1.3 以来,这已作为closest()函数内置。例如:$('#foo').closest('.bar');


是的 - parents() 遍历树。

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

$('#d').parents("div:first");将选择 div b。

于 2008-10-14T14:16:45.133 回答
17

添加到@ nickf的答案:

jQuery 1.3 用closest.

给定一个 DOM:

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

你可以做:

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

[ Closest返回] 一组元素,其中包含与指定选择器匹配的最接近的父元素,包括起始元素。

于 2009-06-03T13:29:39.870 回答
3

您应该使用closest, 因为parents如果您使用多个元素,它不会给您预期的结果。例如,假设你有这个:

    <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>

并且您想将一个类添加到将<b>元素作为其直接子元素(即 1 和 3)的 div 中。如果你使用$('b').parents('div'),你会得到 div 0、1 和 3。如果你使用$('b').parents('div:first'),你只会得到 div 1。要得到 1 和 3,而不是 0,你必须使用$('b').closest(elem)

于 2009-08-05T19:31:46.470 回答
3

Closest() 从当前元素开始,如果您要查找的父元素与当前元素具有相同的标签(例如,两者都是 div),请使用 parent().closest()

于 2010-07-22T14:54:47.833 回答