Метод add объекта classList
позволяет добавлять CSS классы элементу.
Синтаксис
элемент.classList.add(класс);
Пример
Добавим элементу класс kkk:
<p id="elem" class="www ggg zzz"></p>
let elem = document.querySelector('#elem');
elem.classList.add('kkk');
Результат выполнения кода:
<p id="elem" class="www ggg zzz kkk"></p>
Пример
Добавим элементу класс zzz, который
уже есть в элементе - ничего не произойдет,
так как дубли классов не добавляются:
<p id="elem" class="www ggg zzz"></p>
let elem = document.querySelector('#elem');
elem.classList.add('zzz');
Результат выполнения кода:
<p id="elem" class="www ggg zzz"></p>
Смотрите также
-
метод
classList.remove,
который удаляет заданный класс -
метод
classList.contains,
который проверяет заданный класс -
метод
classList.toggle,
который чередует заданный класс