and some(...">

Select an item that does not contain a string in the attribute

let's say i have

<TR style = "background-color : red ;"> 

and some

 <TR> 

(note that the spaces next to the colon and semicolon are intentional, because the page I'm dealing with is written this way)

now this:

 $('.detailtable tr:not([style~="darkgray"])') 

works great. But it says:

[name! = "value"] cannot take advantage of the performance improvements provided by the DOM querySelectorAll () built-in query method.

so I was wondering: my expression is the best or something like:

 $('.detailtable tr').not('[style~="darkgray"]') // this doesn't work! 

works better? And what is the correct way to write this last expression?

Thanks in advance

+8
jquery jquery-selectors
source share
3 answers

If you really want to "select an element that does not contain a string in the attribute ", you should use *= instead of ~= , for example:

 $('.detailtable tr').not('[style*="darkgray"]'); 

Here's the fiddle .


And no, using .not probably not faster. querySelectorAll should be able to parse this selector as is.

See fiddle .


Edit: If you really like IE8, using the .not method instead of the :not selector will give you a small performance boost. The reason for this is very simple: IE8 supports an attribute selector, but not a negation selector.

+20
source share

I suggest you take a look at this.

Interestingly, pseudo selectors (like ": not") tend to actually be slower than using a function next to the initial selector. Actually ... they are apparently "twice as slow."

I quote:

  • $("#id p");
  • $("#id").find("p");

Wouldn't it surprise you that the second method can be more than twice as fast as the first? the knowledge that breeders are superior to others (and why) is a pretty key building block to make sure that your code works well and does not interfere with your users expect something to happen.

I would go with .not my friend!

0
source share

From the W3C Recommendation , what you are currently using should work fine even with document.querySelectorAll() .

Perhaps you can check if it works as expected.

0
source share

All Articles