gpt4 book ai didi

javascript - jQuery 找到 .Selector 但不是嵌套选择器 (.selector .selector)

转载 作者:塔克拉玛干 更新时间:2023-11-02 21:29:45 28 4
gpt4 key购买 nike

我想找到与选择器匹配的所有元素,但如果它已经包含在匹配元素中则不查找。

$('#container').find('.child').not('.child .child');

请注意,.child 元素不一定是直接后代。

为什么这行不通?

我想选择将出现在 $('#container').find('.child') 中的所有元素,但排除/filter() 任何它将在这里 $('#container').find('.child .child') 因为它的祖先之一是 .child

var children = $('#container').find('.child').filter(function (i, el) {
return !$(el).closest('.child').length;
});

出于某种原因,这也不起作用 JSFIDDLE

片段改编自@RonenCypis 的回答

var selector = ' .child ';
var children = $('#container').find(selector).filter(function(i, el) {
return !$(el).closest(selector).length;
});
children.css('background-color', 'blue');
#container div {
float: left;
display: inline-block;
width: 50px;
height: 50px;
color: #fff;
margin: 10px;
background-color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
<div class="child">one
<div class="child">one one</div>
</div>
<div class="child">two
<div class="child">two one</div>
</div>
<div class="child">three</div>
<div class="child">four
<div class="child">four one</div>
</div>
</div>

最佳答案

您可以使用 parents而不是 closest 来查找当前元素的祖先。 closest 除了祖先之外还匹配当前元素。

var selector = ' .child ';
var children = $('#container').find(selector).filter(function(i, el) {
return !$(el).parents(selector).length;
});
children.css('background-color', 'blue');
#container div {
float: left;
display: inline-block;
width: 50px;
height: 50px;
color: #fff;
margin: 10px;
background-color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
<div class="child">one
<div class="child">one one</div>
</div>
<div class="child">two
<div class="child">two one</div>
</div>
<div class="child">three</div>
<div class="child">four
<div class="child">four one</div>
</div>
</div>

关于javascript - jQuery 找到 .Selector 但不是嵌套选择器 (.selector .selector),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33804072/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com