Разница между «атрибутом» (attribute) и «свойством« (property)



🔹Атрибуты (Attributes)



Атрибуты — это дополнительные значения, которые вы можете назначить тегам в вашем HTML-коде. Они представлены в исходном коде страницы и первоначально устанавливают свойства элементов.



<input type="text" value="Hello, World!" disabled>



В данном примере type, value и disabled — это атрибуты тега input.



Особенности атрибутов:



1️⃣Строковые значения: Даже если атрибут представляет число или другой тип данных, его значение всегда будет строкой.

2️⃣Нечувствительность к регистру: Имена атрибутов можно записывать любыми буквами — большими или маленькими, это не повлияет на работу.

3️⃣Видны в innerHTML: Если вы посмотрите на свойство innerHTML элемента, то увидите все атрибуты, указанные в разметке.



🔹Свойства (Properties)



Свойства — это характеристики DOM-узлов, которые вы можете читать или изменять с помощью JavaScript. Они представляют текущее состояние элемента в браузере, которое может меняться во время выполнения скрипта.



const inputElement = document.querySelector('input');

inputElement.value = "New Text";



В данном примере мы меняем свойство value у объекта inputElement.



Особенности свойств:



1️⃣Различные типы данных: Свойства могут иметь различные типы данных, не только строки.

2️⃣Чувствительность к регистру: Имена свойств нужно указывать в точном регистре, в отличие от атрибутов.

3️⃣Интерактивность с JavaScript: Свойства представляют собой характеристики объектов JavaScript и могут изменяться в любое время при выполнении скрипта.



#JavaScript #ОбучающийПост #HTML