jQuery:找到最接近的元素,不一定是父元素

时间:2014-01-02 16:17:55

标签: jquery html dom

我很清楚closest()函数“在DOM树上移动,直到找到所提供选择器的匹配”。但是,有没有办法让这个函数从定义的点搜索所有元素及其子元素?

<ul id="one" class="level-1">
  <li class="item-i">I</li>
  <li id="ii" class="item-ii">II
  <ul class="level-2">
    <li class="item-a">A</li>
    <li class="item-b">B
      <ul class="level-3">
        <li class="item-1">1</li>
        <li class="item-2">2</li>
        <li class="item-3">3</li>
      </ul>
    </li>
    <li class="item-c">C</li>
  </ul>
  </li>
  <li class="item-iii">III</li>
</ul>

如果我选择类item-iii的元素并想要返回类item-3的元素,那么选择器会是什么样的?如果我正确理解closest(),它将会在DOM树上运行但从不检查是否有任何元素具有与第二个选择器匹配的子元素。

1 个答案:

答案 0 :(得分:5)

在所有父母中搜索.item-3个元素,然后获取这些元素的第一个(最接近的),然后在最近的具有这样元素的父元素中找到实际的.item-3元素,这将是无效的,但可以这样做:

$(this).parents(':has(.item-3)').first().find('.item-3');

FIDDLE

如果它只是在兄弟姐妹的范围内,它可能更有效率

$(this).siblings(':has(.item-3)').first().find('.item-3');

FIDDLE

等等,越具体,越有效。

它甚至适用于closest();

$(this).closest(':has(.item-3)').find('.item-3');

FIDDLE