Question

在我的javascript体验中，我发现这是一个非常常见的任务“搜索具有某些条件的元素的最近祖先（标记名称，类，......）”。 jquery的parents（）方法可以完成这项工作吗？ parent（）的返回元素的顺序是可预测的吗？从上到下还是从下到上？目前我使用这个效用函数：

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

有人可以告诉我是否有聪明的方法来完成这项工作？

Answer 1

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

是的 - 父母（）穿过树。

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

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

Answer 2

添加到@ 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返回一组] 包含最近父级的元素与指定匹配的元素选择器，起始元素包括在内。

Answer 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>元素作为其直接子元素的div（即1和3）。如果使用$('b').parents('div')，则得到div为0,1和3.如果使用$('b').parents('div:first')，则只获得div 1.要获得1和3，而不是0，则必须使用{{1 }}

Answer 4

nearest（）从当前元素开始，如果您要查找的父元素与当前元素具有相同的标记（例如，两者都是div），请使用parent（）。nearest（）

jQuery中最近的祖先节点

4 个答案: