jQuery - 多个 :not 选择器答案

【问题标题】：jQuery - multiple :not selectorjQuery - 多个 :not 选择器
【发布时间】：2011-10-31 23:29:45
【问题描述】：

我正在尝试定位不以“#”开头且不包含内嵌 javascript 的页面范围的链接，但我在弄清楚如何正确构建选择器时遇到了问题。

根据我在 google 上搜索的有关多个选择器的信息，这应该可以工作，两个选择器独立工作，而不是一起工作！

$('a:not([href*=javascript]), a:not([href^=#])')
.each(function(){...

【问题讨论】：

你试过'or'运算符吗？比如：$('a:not([href*="javascript|#"])')
您的原始代码 is working fine 所以请发布更多代码和 HTML，以便我们看看出了什么问题..
jQuery - Multiple Selectors in a :not()?的可能重复

标签： jquery jquery-selectors

【解决方案1】：

尝试使用

$('a:not([href*=javascript]):not([href^=#])') ...

【讨论】：

虽然这可行，但您不必要地否定了 2 次。我不知道它可能会对性能产生影响。虽然我喜欢明确/简单，但它可能比$('a:not([href*=javascript],[href^=#])') 更容易阅读
嗨@AdrienBe 在这个小提琴中：jsfiddle.net/pranavcbalan/dd6tuent/2 我想避免第二列和最后一列。我正在尝试按照您的建议执行此操作： $('input:not(:last :nth-child(2))', $tr).each(function() { // 迭代除最后一个和第二个输入之外的输入tot += Number($(this).val()) || 0; // 解析并添加值，如果是 NaN 则添加 0 });但这无济于事。请问有什么想法吗？
@jtbandes，我也尝试过您的建议，但不起作用。我在某处犯了一些小错误。你能检查一下jsfiddle吗？
@Sizzler 您是否首先通过避免“仅”一列来使其工作？
@AdrienBe 是的。我能做到这一点。请查看这个小提琴。 jsfiddle.net/sizzler/xodzm0qw/3这里可以避免size1列和total列。

【解决方案2】：

你也可以试试：

$('a').not('[href^=#],[href*=javascript]')

【讨论】：

快速提示：如果您已经在变量中添加了选择器，请不要忘记在引号之间添加逗号。如：$('a').not(selOne + ',' + selTwo + ',' + selX);
出于性能原因，我们可能应该使用:not 而不是.not()。见stackoverflow.com/questions/8845811/…

【解决方案3】：

如jQuery - Multiple Selectors in a :not()? 所示，这是正确的做法：

$( 'a:not([href*=javascript],[href^=#])' )

如果您已经有选择器在变量中取反，请不要忘记在逗号周围加上引号

var selOne = '[href*=javascript]';
var selTwo = '[href^=#]';
$('a:not(' + selOne + ',' + selTwo + ')')

我承认代码有点混乱，但它有一个优势，你可以这样做：

var selOne = '[href*=javascript], [href^=#]';
var selTwo = '.anotherSelector, .andAnother, .andSoOn';
$('a:not(' + selOne + ',' + selTwo + ')')

当您出于某种原因需要对选择器进行分组时，它很有用，即。在代码的其他地方使用同一组选择器。

使用相同技术的实例

$('div:not(.rose-flower,.bus-vehicle)').css('color','red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="bus-vehicle">I am a bus</div>
<div class="strawberry-fruit">I am a strawberry</div>
<div class="rose-flower">I am a rose</div>

同样在http://jsfiddle.net/bmL8gz5j/

:not vs .not()：出于性能原因，您应该使用:not 而不是.not()，请参阅Performance differences between using ":not" and ".not()" selectors?

【讨论】：