jQuery:包含x的最高级别元素

Question

我正在寻找一种方法来选择包含某个元素的元素,然后过滤结果以获得最高级别.很难解释,但通过一个例子变得更容易:

<div id="one">
    <div id="two">
        <div id="three" class="find-me"></div>
    </div>
</div>
<div id="four">
    <div id="five" class="find-me"></div>
</div>

在这种情况下,我希望我的集合包含#one和#four.如果我尝试做这样的事情:

var elements = $('div').has('.find-me');

我得到了元素#one,#two和#four.

注意:$('div')在这种情况下,"最高级别"与第一个选择器中最顶层的元素相关.

Answer 1

那么什么highest level是定义,有点模棱两可,因为在实践中,如果.find-me你的页面中有任何一个,那么最高级别的父级将是html标记!这没用.

通过更具体地定义您的问题,您可以为此提出更清晰的定义highest-definition,例如,the farthest div parent等等.并且为了遍历您可以使用的元素的父母.parents()和.closest()方法.

var farthestDiv = $(".find-me").parents("div").last();

很明显,如果你有多个出现,find-me你需要在一个.each()循环中运行它.

在这里看一个例子:http://jsfiddle.net/GsQDb/3/