classList īpašība

Īpašība classList satur pseido masīvu no elementa CSS klasēm, kā arī ļauj pievienot un noņemt elementa klases, pārbaudīt noteiktas klases esamību starp elementa klasēm.

Runa ir par atribūtu class, kura iekšpusē var rakstīt vairākas klases atdalot ar atstarpēm, piemēram www ggg zzz. Izmantojot classList var noņemt, piemēram, klasi ggg, neietekmējot pārējās klases.

Sintakse

element.classList;

Piemērs . Klašu skaits

Uzzināsim elementa klašu skaitu:

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

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

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

Koda izpildes rezultāts:

3

Piemērs . Iterējam cauri klasēm

Izvadīsim pēc kārtas elementa klases:

<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);
}

Koda izpildes rezultāts:

'www'
'ggg'
'zzz'

Skatīt arī

metodi classList.add,
kas pievieno norādīto klasi
metodi classList.remove,
kas noņem norādīto klasi
metodi classList.contains,
kas pārbauda norādīto klasi
metodi classList.toggle,
kas pārmaiņus ieslēdz un izslēdz norādīto klasi