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