jQuery:查找不一定是父元素的最近元素
我很清楚jQuery:查找不一定是父元素的最近元素,jquery,html,dom,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</
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>
- i
- ii
- a
- b
- 1
- 2
- 3
- c
- iii
如果我选择了一个类别为
item iii
的元素,并希望返回类别为item-3
的元素,那么选择器会是什么样子?如果我正确理解最近的()
,它将进入DOM树,但从不检查任何元素是否有与第二个选择器匹配的子元素。搜索所有父元素以查找。item-3
元素,然后获取第一个(最近的)元素,然后在最接近的父元素中查找实际的.item-3
元素是无效的,但可以这样做:
$(this).parents(':has(.item-3)').first().find('.item-3');
如果只是在李兄弟家里,效率可能会更高
$(this).siblings(':has(.item-3)').first().find('.item-3');
等等,越具体,一般来说效率越高
它甚至可以与closest()一起工作代码>
搜索所有父项以查找。item-3
元素,然后获取这些元素中的第一个(最接近的),然后找到实际的。在最近的父项中有这样一个元素的item-3
元素将是无效的,但可以这样做:
$(this).parents(':has(.item-3)').first().find('.item-3');
如果只是在李兄弟家里,效率可能会更高
$(this).siblings(':has(.item-3)').first().find('.item-3');
等等,越具体,一般来说效率越高
它甚至可以与closest()一起工作代码>
不确定您到底在找什么。您是否试图执行类似于“查找具有类item-3
的元素,该元素位于与我相同的ul
中?如果是这样,我将使用parent
达到您想要的高度,然后使用find
@JacobM,我认为相同,但使用:$(this)。最近('ul')。find('item-3'))
你能不能不从顶部搜索并使用find()
?$(“body”)。查找(.item-3”);
Ciaran:这相当于只做$(.item-3'))
.A.Wolff:这会有点不同,因为如果他选择的初始元素恰好位于一个不是顶级元素的ul内部,该怎么办?我正在想象使用父级
将其设置得足够高,以确保您处于所需的级别,然后查找
。不确定您到底在寻找什么。是吗是否尝试执行类似“查找classitem-3
中的元素,该元素位于我所在的ul
中?如果是这样的话,我会使用parent
来达到你想达到的高度,然后使用find
@JacobM,我想是一样的,但是使用:$(this.nest('ul')。find('.item-3')
你能不能不从顶部搜索并使用find()
<代码>$(“正文”)。查找(“.item-3”)代码>Ciaran:这相当于只做$('.item-3')
.A。沃尔夫:这将表现得有点不同,因为如果他选择的初始元素恰好位于ul内部,而ul不是顶级元素,该怎么办?我想象着使用parent
来达到足够高的水平,以保证你达到你想要的水平,然后找到。这正是我想要的。没有想到对最近的元素使用find()
。第三种选择效果最好。非常感谢。还有一个问题,是否有方法将此限制为搜索高于指定值的元素(在您的示例中为$this
)?是的,您可以执行$(this).parent().closest(':has(.item-3')).find('.item-3')
as closest()以当前元素开始,这将使它以父元素开始。作为旁注,我通常会避免使用parents()
(带s),因为它非常不有效。但是parent()
只返回直接的父元素,如果它是上面的第三个父对象,而它的子对象包含所需的类呢?这正是我想要的。没有想到对最近的元素使用find()
。第三种选择效果最好。非常感谢。还有一个问题,是否有方法将此限制为搜索高于指定值的元素(在您的示例中为$this
)?是的,您可以执行$(this).parent().closest(':has(.item-3')).find('.item-3')
as closest()以当前元素开始,这将使它以父元素开始。作为旁注,我通常会避免使用parents()
(带s),因为它非常不有效。但是parent()
只返回直接的父元素,如果它是上面的第三个父对象,而它的子对象包含所需的类,该怎么办?