我有一种情况,我需要选择某个元素的所有后代,但排除那些属于容器的孩子的容器,这个容器等于我运行我的选择器的容器的CSS类。
相当复杂的描述。
<div class="container">
<div class="element"></div>
<div class="element"></div>
<div class="element"></div>
<div class="element">
<div class="container">
<div class="element"></div>
<div class="element"></div>
<div class="element"></div>
</div>
</div>
在最外面的DIV上运行一个jQuery .find(‘。element’)会得到我所有的DIV,甚至是第二个容器内的DIV。那就是我尽量避免。
在这种情况下,是否有快速简单的jQuery选择器解决方案?
解决方法
我想你想要使用的是
not选择器。喜欢这个..
$(".container").not(".container .container")
或者,您可以使用children选择器,从一级深度获取孩子。这将排除嵌套div。
要更清楚一点,我想在使用’find’后,您将要使用not selector。喜欢这个:
$(".container").find(".element").not($(".container .container .element"))
您可以将函数传递给不可用,因此您可以使该函数查看每个元素的父项匹配,以查看它是否嵌套在具有相同类的元素之内。
http://jsfiddle.net/QXfs2/6/
removeIfnested = function(index) {
// this is the corrent DOM element
var $this = $(this),return_value = false;
$.each($this.attr('class').split(/\s+/),function(index) {
if ($this.parents("." + this).length > 0) {
return_value = default_value || true;
}
});
return return_value;
}
$(".container").find(".element").not(removeIfnested);
如果你可以添加一个类到嵌套容器,那将是理想的,那就是:
$(".container").find(".element").not($(".nested .element"))
假设你将类“嵌套”添加到你的内部容器div中。