Уласцівасць classList

Уласцівасць classList змяшчае псеўдамасіў CSS класаў элемента, а таксама дазваляе дадаваць і выдаляць класы элемента, правяраць наяўнасць пэўнага класа сярод класаў элемента.

Гаворка ідзе пра атрыбут class, усярэдзіне якога можна пісаць некалькі класаў праз прабел, напрыклад www ggg zzz. З дапамогай classList можна выдаліць, напрыклад, клас ggg, не закрануўшы астатнія класы.

Сінтаксіс

элемент.classList;

Прыклад . Колькасць класаў

Даведаемся пра колькасць класаў элемента:

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

let elem = document.querySelector('#elem');

let length = elem.classList.length;
console.log(length);

Вынік выканання кода:

3

Прыклад . Перабіраем класы

Вывядзем па чарзе класы элемента:

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

let elem = document.querySelector('#elem');
let classNames = elem.classList;

for (let className of classNames) {
	console.log(className);
}

Вынік выканання кода:

'www'
'ggg'
'zzz'

Глядзіце таксама

метад classList.add,
які дадае зададзены клас
метад classList.remove,
які выдаляе зададзены клас
метад classList.contains,
які правярае зададзены клас
метад classList.toggle,
які чаргуе зададзены клас