Понимание отношений между атрибутами HTML и свойствами объекта DOM.
Когда веб-браузер загружает HTML-страницу, он создает соответствующие объекты DOM на основе узлов DOM документа.
Например, если страница содержит следующий элемент input :
Например, если страница содержит следующий элемент ввода:
Веб-браузер создаст объект HTMLInputElement .
Элемент input имеет два атрибута:
Атрибут type со значением text.
Атрибут id со значением username.
Сгенерированный объект HTMLInputElement будет иметь соответствующие свойства:
input.type с текстом значения.
input.id со значением username.
Другими словами, веб-браузер автоматически преобразует атрибуты элементов HTML в свойства объектов DOM.
Однако веб-браузер только преобразует стандартные атрибуты в свойства объекта DOM. Стандартные атрибуты элемента перечислены в спецификации элемента.
Сопоставление атрибут-свойство не всегда однозначно. Например:
элемент.атрибуты
Свойство element.attributes предоставляет динамическую коллекцию атрибутов, доступных для определенного элемента. Например:
Вывод:
Обратите внимание, что element.attributes является NamedNodeMap, а не массивом, поэтому у него нет методов массива.
Синхронизация атрибутов и свойств
При изменении стандартного атрибута соответствующее свойство автоматически обновляется с некоторыми исключениями, и наоборот.
Предположим, у вас есть следующий элемент ввода:
В следующем примере показано, как изменение атрибута tabindex распространяется на свойство tabIndex и наоборот.
В следующем примере показано, что изменение атрибута значения отражается в значении;
Завтра продолжим.. Сегодня не очень хорошо себя чувствую.
Спасибо за прочтение.