91

I'm trying to target page-wide links that do not start with a '#' and do not include in-line javascript but I'm having problems figuring out how to structure the selector properly.

Based on what I've googled about multiple selectors this should work, both selectors work independently, just not together!

$('a:not([href*=javascript]), a:not([href^=#])')
.each(function(){...
Keavon
  • 6,837
  • 9
  • 51
  • 79
Hill79
  • 994
  • 1
  • 8
  • 13

3 Answers3

159

Try using

$('a:not([href*=javascript]):not([href^=#])') ...
jtbandes
  • 115,675
  • 35
  • 233
  • 266
  • 8
    Although this works, you unnecessarily negate 2 times. It may have a performance impact, I don't know. I like the explicitness/simplicity though, it might be easier to read than `$('a:not([href*=javascript],[href^=#])')` – Adriano Mar 12 '15 at 10:36
  • Hi @AdrienBe In this fiddle: https://jsfiddle.net/pranavcbalan/dd6tuent/2/ I want to avoid the second column and the last one. I am trying to do this as per your advice: $('input:not(:last :nth-child(2))', $tr).each(function() { // iterate over inputs except last and second one tot += Number($(this).val()) || 0; // parse and add value, if NaN then add 0 }); but it does not helps. Any Idea please? – 3AK Jun 21 '16 at 02:38
  • @jtbandes, I tried with your suggestion as well, doesn't works. I am doing some small mistake somewhere. Could you please check the jsfiddle. – 3AK Jun 21 '16 at 02:41
  • @Sizzler did you get it working first by avoiding "just" one column? – Adriano Jun 21 '16 at 10:45
  • @AdrienBe yes. I could do it. Please Check out this fiddle. https://jsfiddle.net/sizzler/xodzm0qw/3/ I am able to avoid the size1 column and the total column here. – 3AK Jun 22 '16 at 12:21
  • @Sizzler awesome. That's a good 1st step. Sry I can't help atm tho, too busy. Good luck – Adriano Jun 22 '16 at 14:51
  • It's ok! No problem. :) @PranavCBalan gave a way ahead. :) – 3AK Jun 23 '16 at 05:19
  • You better put quotation marks now. ie: $('a:not([href*="javascript"]):not([href^="#"])'). Or else, it sometimes makes error in the console. – JFC Aug 08 '18 at 15:06
49

You could also try:

$('a').not('[href^=#],[href*=javascript]')
DarkAjax
  • 15,955
  • 11
  • 53
  • 65
  • 1
    Quick note: do not forget to add the comma in between quotes if you already have your selectors in variables. Such as: `$('a').not(selOne + ',' + selTwo + ',' + selX);` – Adriano Mar 12 '15 at 09:51
  • We probably should use `:not` rather than `.not()` by the way, for performance reasons. see http://stackoverflow.com/questions/8845811/performance-differences-between-using-not-and-not-selectors – Adriano Mar 12 '15 at 09:58
19

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?

Community
  • 1
  • 1
Adriano
  • 19,463
  • 19
  • 103
  • 140