Есть желание присоединиться к интересным IT проектам? Смотри открытые вакансии.

JavaScript метод Element.hasAttribute()

JavaScript Element

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

JavaScript метод hasAttribute() объекта Element возвращает логическое значение, указывающее на то, имеет ли указанный элемент заданный атрибут или нет.

Поддержка браузерами

МетодChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
Edge
hasAttribute()ДаДаДаДаДаДа

JavaScript синтаксис:

const booleanResult = element.hasAttribute( attributeName );

attributeName - String

Версия JavaScript

Document Object Model (DOM) Level 1 Core

Значения параметров

ПараметрОписание
attributeNameИмя атрибута, значение которого вы хотите проверить на наличие. Обязательный параметр.

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

<!DOCTYPE html>
<html>
	<head>
		<title>Использование методов hasAttribute(), getAttribute() и setAttribute()</title>
	</head>
	<body>
		<button onclick = "checkAttr()">Click me</button> <!-- добавляем атрибут событий onclick -->
		<p data-val = "1"></p>
		<script>
	function checkAttr() {
	  const p = document.querySelector("p"), // выбираем первый элемент <p> в документе
	        attr = "data-val"; // инициализируем переменную строковым значением
    
	  if ( p.hasAttribute(attr) ) { // проверяем имеется ли у элемента атрибут со значением, содержащимся в переменной attr
	    const attrVal = p.getAttribute(attr); // получаем значение этого атрибута
	    p.innerHTML = attrVal; // добавляем элементу <p> новое содержимое (значение атрибута data-val )
    
	    const newAttrVal = Number(attrVal) + 1; // инициализируем переменную, которая увеличивает значение атрибута data-val на 1
	    p.setAttribute(attr, newAttrVal); // устанавливаем новое значение для атрибута data-val
	  }  
	}
		</script>
	</body>
</html>

В этом примере с использованием атрибута событий onclick при нажатии на кнопку (HTML элемент <button>) вызываем функцию, которая:

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

Пример использования методов hasAttribute(), getAttribute() и setAttribute()
Пример использования методов hasAttribute(), getAttribute() и setAttribute()
JavaScript Element
×

Кажется, вы используете блокировщик рекламы :(

Этот ресурс не является коммерческим проектом и развивается на энтузиазме автора сайта, который посвящает все свое свободное время этому проекту.

Добавьте, пожалуйста, basicweb.ru в исключения блокировщика рекламы, этим вы поможете развитию проекта.