哪种JQuery选择器排除其父项与给定选择器匹配的项目？

我有

var $set = $('.foo,.bar').filter(
    function() {return $(this).parents('.baz').length < 1;});

作为选择所有类别为foo或bar且不从类别为的元素派生的元素的方法baz。是否有一个选择器可以完成相同的事情而无需过滤lambda？

<div class='foo'/><!--match this-->
<div class='bar'/><!--match this-->
<div class='baz'>
    <div class='foo'/> <!--don't match this-->
</div>

事实的真相是，jQuery根本没有一种特别优雅的方式来完成您想要的事情。尽管混乱的答案确实有用，但您必须怀疑，复杂的选择器（在复杂的网页中，选择器的速度可能如此之慢）是否值得您拥有更冗长但更快的过滤器功能。这实际上没什么大不了的，我个人对我会避免的特别冗长而费解的选择器感到厌倦。

另一种选择是创建自己的选择器，因为jQuery非常棒：

jQuery.expr[':'].parents = function(a,i,m){
    return jQuery(a).parents(m[3]).length < 1;
};

$('.foo,.bar').filter(':parents(.baz)');

该expr地图是Sizzle选择器引擎的一部分，可以在这里找到文档：Sizzle自定义伪选择器

$('.foo:not(.baz .foo),.bar:not(.baz .bar)')

我无法使它工作：

$(".children:not(#parent .children)");

但是我可以使它工作：

$(".children").not($("#parent .children"));

注意：不确定这是否与我使用的1.2.6的jQuery版本有关

试试这个：

$('div').filter(function () {
  return ($(this).parent().not('.baz'));
})

选择器混乱给应该工作：

$('.foo:not(.baz .foo),.bar:not(.baz .bar)')

只是想给您一些有关FireBug扩展的提示，名为FireFinder，您可以使用它来测试CSS / jQuery选择器。

在网站上：Firefinder是Firebug（在Firefox中）的扩展，并提供了快速找到与所选CSS选择器或XPath表达式匹配的HTML元素的功能。它使您可以在查看页面的同时立即在页面中测试CSS选择器，同时突出显示匹配的元素。

var $li = jQuery('li', this).not('.dropdown-menu > li');

我正在使用Roots主题，它们将下拉菜单从“子菜单”更改为“ .dropdown-菜单”

将：not（'。baz'）添加到顶级选择器。