jQuery селектор атрибутов [attribute!='value']

jQuery селекторы

Определение и применение

jQuery селектор [attribute!='value'] выбирает элементы, которые либо не имеют указанный атрибут, или имеют указанный атрибут, но не с определенным значением.


Обращаю Ваше внимание, что селектор атрибутов [attribute!='value'] эквивалентен следующему jQuery селектору отрицания:

$("selector:not([attribute='value'])")

jQuery синтаксис:

$("[attribute!='value']")

$("selector[attribute!='value']")

Добавлен в версии jQuery

1.0

Селектор в CSS

Это селектор jQuery, он не является частью спецификации CSS.

Пример использования

<!DOCTYPE html>
<html>
	<head>
		<title>Использование jQuery селектора атрибутов [attribute!='value']</title>
		<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
		<script>
	$(document).ready(function(){
	  $("a[href!='#']").css("color", "red"); // выбираем все HTML элементы <a>, которые либо не имеют атрибут href, или имеют атрибут href, но не со значением #
	  $("a:not([href='#'])").css("font-size", "2em"); // выбираем все HTML элементы <a>, которые либо не имеют атрибут href, или имеют атрибут href, но не со значением #
	});
		</script>
	</head>
	<body>
		<a href = "#">#</a><br>
		<a href = "basicweb.ru">basicweb.ru</a><br>
		<a>No href attribute</a>
	</body>
</html>

В этом примере с использованием jQuery селектора атрибутов [attribute!='value'] мы выбрали все элементы <a> (гиперссылки) в документе, которые, либо не имеют атрибут href, или имеют атрибут href, но не со значением # и стилизовали их с использованием CSS свойства color (цвет текста). Кроме того с использованием jQuery селектора отрицания мы выбрали те же элементы и установили для них размер шрифта 2em.

Результат нашего примера:

Пример использования jQuery селектора атрибутов [attribute!='value'] (не с атрибутом и атрибутом с определенным значением).
Пример использования jQuery селектора атрибутов [attribute!='value'] (не с атрибутом и атрибутом с определенным значением).
jQuery селекторы