Attribute Not Equal [attr!="value"]S2C Home « Selectors « Attribute Not Equal [attr!="value"]

Attribute Value Non-Match selector.

Shorthand version $('[attr!="value"]')

Description

The [attr!="value"] selector, selects all elements that either don't have the specified attribute name, or do have the specified attribute but not with a value matching the specified string.

Being a jQuery extension the [attr!="value"] pseudo selector is not part of any current CSS specification. Therefore [attr!="value"] cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method.

The same results can be achieved with valid CSS using $("CSSselector").not('[name="value"]'), without the hit to performance.

If this selector is not preceded by another selector, the universal selector ("*") is implied and so the whole DOM will be searched. Use another selector as in the example below to narrow the search and improve performance.

Syntax


Signature Description
jQuery('[attr!="value"]')Attribute Value Non-Match

Parameters


Parameter Description
attrThe attribute name.
valueThe attribute value which can be either an unquoted single word or a quoted string.

Return

N/A.

Attribute Not Equal [attr!="value"] Examplego to top of page Top

Selects all elements that either don't have the specified attribute name, or do have the specified attribute but not with a value matching the specified string.

The following example will select all 'h4' elements that don't have the id attribute with a value of 'notequal' and turn the background colour orange.


$(function(){
  $('#btn16').on('click', function() {
    $('h4[id!="notequal"]').css('backgroundColor', 'orange');
  });
}); 

Press the buttons below to action the above code:


A 'h4' heading 4 with no id attribute

go to home page Homepage go to top of page Top