什么 JQuery 选择器排除父项与给定选择器匹配的项目？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/965816/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What JQuery selector excludes items with a parent that matches a given selector?
提问by Dan Davies Brackett
I have
我有
var $set = $('.foo,.bar').filter(
function() {return $(this).parents('.baz').length < 1;});
as a way to select all the elements whose classes are either fooor barand who do not descend from an element whose class is baz. Is there a selector that will accomplish the same thing without the need for a filtering lambda?
作为选择类为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>
回答by Paolo Bergantino
The truth of the matter is that jQuery simply does not have a particularly elegant way to do what you want. While chaos' answer does work, you have to wonder whether the complicated selector (that would be about as slow as a selector can be in a complicated webpage) is worth it over the more verbose but faster filter function you have. This is not really that big of a deal, I am just personally weary of particularly long, convoluted selectors when I can avoid it.
事情的真相是，jQuery 根本没有一种特别优雅的方式来做你想做的事。虽然 Chaos 的答案确实有效，但您必须怀疑复杂的选择器（与选择器在复杂网页中的速度一样慢）是否值得拥有更冗长但速度更快的过滤器功能。这并不是什么大不了的事，当我可以避免它时，我个人只是厌倦了特别长、令人费解的选择器。
A different option is to create your own selector, since jQuery is awesome:
另一种选择是创建自己的选择器，因为 jQuery 很棒：
jQuery.expr[':'].parents = function(a,i,m){
return jQuery(a).parents(m[3]).length < 1;
};
$('.foo,.bar').filter(':parents(.baz)');
The exprmap is part of the Sizzle selector engine and documentation can be found here: Sizzle Custom Pseudo-Selectors
该expr地图是 Sizzle 选择器引擎的一部分，可以在此处找到文档：Sizzle Custom Pseudo-Selectors
回答by chaos
$('.foo:not(.baz .foo),.bar:not(.baz .bar)')
回答by going
I couldn't get this to work:
我无法让它工作：
$(".children:not(#parent .children)");
But I can get this to work:
但我可以让它工作：
$(".children").not($("#parent .children"));
Note: Not sure if this has something to do with the jQuery version I'm using 1.2.6
注意：不确定这是否与我使用的 jQuery 版本 1.2.6 有关
回答by Sebastian Viereck
try this one:
试试这个：
$('div').filter(function () {
return ($(this).parent().not('.baz'));
})
回答by BengtBe
The selector chaosgives should work:
选择器混乱给出应该工作：
$('.foo:not(.baz .foo),.bar:not(.baz .bar)')
Just wanted to give you a tip about an extension to FireBugcalled FireFinderthat you can use to test your css/jquery selectors.
只是想给你一个关于名为FireFinder 的FireBug扩展的提示，你可以用它来测试你的 css/jquery 选择器。
From the website: Firefinder is an extension to Firebug (in Firefox) and offers the functionality to, in a quick way, find HTML elements matching chosen CSS selector(s) or XPath expression. It allows you to instantly test your CSS selectors in the page while seeing the content at the same time, and matching elements will be highlighted.
来自网站：Firefinder 是 Firebug（在 Firefox 中）的扩展，并提供了快速查找与所选 CSS 选择器或 XPath 表达式匹配的 HTML 元素的功能。它允许您在查看内容的同时立即测试页面中的 CSS 选择器，并且匹配的元素将被突出显示。
回答by Devin Walker
var $li = jQuery('li', this).not('.dropdown-menu > li');
var $li = jQuery('li', this).not('.dropdown-menu > li');
I'm using Roots theme and they change the dropdowns from 'sub-menu' to '.dropdown-menu'
我正在使用 Roots 主题，他们将下拉菜单从“子菜单”更改为“.dropdown-menu”
回答by Dave Ward
Add a :not('.baz') to your top level selector.
添加 :not('.baz') 到您的顶级选择器。
