Управление HTML атрибутами через JavaScript

В JavaScript существует несколько способов взаимодействия с атрибутами HTML-элементов. Методы getAttribute(), setAttribute(), hasAttribute() и removeAttribute() предоставляют универсальный способ управления атрибутами.

Стандартные HTML-атрибуты можно читать и изменять напрямую через свойства объекта HTMLElement, полученного через селекторы. Важно помнить о различиях в именах свойств и атрибутов (например, defaultValue для атрибута value поля input), а также о чувствительности к регистру свойств.

Для управления CSS-классами элемента следует использовать интерфейс classList с методами add(), remove(), contains() и toggle(). Он позволяет удобно добавлять, удалять, проверять наличие и переключать классы.

Атрибуты, начинающиеся с префикса data-, доступны через свойство dataset объекта Element. Они позволяют хранить произвольные данные, доступные через свойства объекта dataset, имена которых соответствуют именам атрибутов без префикса data-.

Источник: JastaFly