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 |
---|---|
attr | The attribute name. |
value | The attribute value which can be either an unquoted single word or a quoted string. |
Return
N/A.
Attribute Not Equal [attr!="value"]
Example
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');
});
});