JQuery-多重: 非选择器

我正在尝试定位页面范围的链接,这些链接不以“ #”开头,也不包括内联的 javascript,但是我在解决如何正确地构造选择器的问题上遇到了困难。

基于我已经谷歌了多个选择器这应该工作,两个选择器工作独立,只是不在一起!

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

Try using

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

You could also try:

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

As indicated in jQuery - Multiple Selectors in a :not()? , this is the correct way to do this:

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

Don't forget to put quotes around commas if you already already have your selectors to negate in variables

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

I admit that the code gets a bit confusing but it has an advantage, you can do things such as this:

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

It's useful whenever you need to group selectors for some reason, ie. using the same group of selectors somewhere else in the code.


A live example using the same technic

$('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>

Also on http://jsfiddle.net/bmL8gz5j/


:not vs .not(): For performance reasons, you should use :not rather than .not(), see Performance differences between using ":not" and ".not()" selectors?