Метод toggle объекта classList

Метод toggle объекта classList чередует заданный CSS класс элемента: добавляет класс, если его нет и удаляет, если есть.

Синтаксис

javascriptelement.classList.contains(class);

Пример

В данном примере при использовании метода toggle класс zzz удалится, так как он уже есть в элементе:

html<p id="elem" class="www ggg zzz"></p>

javascriptlet elem = document.querySelector('#elem');
elem.classList.toggle('zzz');

Результат выполнения кода:

html<p id="elem" class="www ggg"></p>

Пример

В данном примере при использовании метода toggle класс zzz добавится, так как его нету в элементе:

html<p id="elem" class="www ggg"></p>

javascriptlet elem = document.querySelector('#elem');
elem.classList.toggle('zzz');

Результат выполнения кода:

html<p id="elem" class="www ggg zzz"></p>

Смотрите также