Как переписать класс DOM элемента?

Для переписывания класса DOM элемента в JavaScript можно использовать несколько подходов. Рассмотрим два наиболее распространенных способа.

1. Использование свойства "classList":
DOM элементы имеют свойство "classList", которое предоставляет набор методов для добавления, удаления и переключения классов. Чтобы переписать класс элемента, вы можете использовать методы "add", "remove" и "toggle".

Пример:

// Получаем DOM элемент
const element = document.getElementById("myElement");

// Удаляем существующий класс
element.classList.remove("oldClass");

// Добавляем новый класс
element.classList.add("newClass");

В этом примере мы выбираем DOM элемент с идентификатором "myElement", затем удаляем класс "oldClass" с помощью метода "remove" и добавляем класс "newClass" с помощью метода "add".

2. Использование свойства "className":
Другой способ переписать класс DOM элемента - это использование свойства "className", которое содержит строку с классами, разделенными пробелами. Для изменения класса элемента вы можете просто перезаписать значение свойства "className".

Пример:

// Получаем DOM элемент
const element = document.getElementById("myElement");

// Перезаписываем значение свойства className
element.className = "newClass";

В этом примере мы выбираем DOM элемент с идентификатором "myElement" и перезаписываем его свойство "className" значением "newClass".

Оба подхода позволяют переписать класс DOM элемента, однако использование свойства "classList" рекомендуется, так как оно предоставляет удобные методы для работы с классами.