# Метод toggleClass

Метод `toggleClass` чередует добавление/удаление CSS класса: если его нет - добавит, если есть - удалит.

## Синтаксис

Один CSS класс:

`$(селектор).toggleClass(имя класса);`

Только добавить или удалить CSS класс в зависимости от второго параметра, который принимает значения `true` или `false`:

`$(селектор).toggleClass(имя CSS класса, состояние);`

Несколько CSS классов:

`$(селектор).toggleClass(['класс1', 'класс2', 'класс3', '...']);`

Только добавить или удалить CSS классы в зависимости от второго параметра:

`$(селектор).toggleClass(['класс1', 'класс2', 'класс3', '...'], состояние');`

Применение функции к каждому элементу в наборе, состояние может быть `true` или `false`, и указывает методу - только добавить или только удалить CSS класс:

`$(селектор).toggleClass(function(номер в наборе, текущие классы элемента, состояние), [состояние]);`

## Пример

У нашего абзаца уже есть два класса. Давайте добавим ему еще и класс `www`:

`<p id="test" class="eee ggg">text</p>` `$('#test').toggleClass('www');`

HTML код станет выглядеть так:

`<p id="test" class="eee ggg www">text</p>`

## Пример

А теперь класс `www` уже есть в элементе - давайте его удалим:

`<p id="test" class="eee ggg www">text</p>` `$('#test').toggleClass('www');`

HTML код станет выглядеть так:

`<p id="test" class="eee ggg">text</p>`

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

- методы `addClass`, `removeClass`, `hasClass`
- JavaScript свойство `classList`,
  с помощью которого можно чередовать добавление/удаление класса на чистом JavaScript

← →
↑