Метод toggle() класса HTML DOMTokenList

Определение и использование

Метод toggle() удаляет заданный тег из списка и возвращает false. Если тег не существует, он добавляется и возвращает true.

Пример

Пример 1

Переключить включение/выключение класса "myStyle":

const list = element.classList;
list.toggle("mywStyle");

Попробуйте сами

Пример 2

Добавить класс "myStyle" к элементу:

const list = element.classList;
list.add("myStyle");

Попробуйте сами

Пример 3

Удалить класс "myStyle" из элемента:

const list = element.classList;
list.remove("myStyle");

Попробуйте сами

Пример 4

Добавление нескольких классов к элементу:

element.classList.add("myStyle", "anotherClass", "thirdClass");

Попробуйте сами

Пример 5

Удаление нескольких классов из элемента:

element.classList.remove("myStyle", "anotherClass", "thirdClass");

Попробуйте сами

Пример 6

Получение количества классов элемента:

let numb = element.classList.length;

Попробуйте сами

Пример 7

Переключение классов для создания кнопки выпадающего списка:

document.getElementById("myBtn").onclick = function() {myFunction()};
function myFunction() {
  document.getElementById("myDropdown").classList.toggle("show");
}

Попробуйте сами

Синтаксис

domtokenlist.toggle (token)

Параметры

Параметры Описание
token Обязателен. Маркер для переключения.

Возврат значения

Нет.

Поддержка браузеров

domtokenlist.toggle () является функцией DOM Level 4 (2015).

Он поддерживается всеми браузерами:

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Поддержка Поддержка Поддержка Поддержка Поддержка

Internet Explorer 11 (или более ранние версии) не поддерживает domtokenlist.toggle ().

Связанные страницы

Свойство length

Метод item ()

Метод add ()

Метод remove ()

Метод replace ()

Метод forEach ()

Метод entries ()

Метод keys ()

Метод values ()

Объект DOMTokenList