A classList tulajdonság

A classList tulajdonság az elem CSS osztályainak pszeudótömbjét tartalmazza, valamint lehetővé teszi az elem osztályainak hozzáadását és eltávolítását, valamint egy adott osztály jelenlétének ellenőrzését az elem osztályai között.

Itt a class attribútumról van szó, amelybe több osztályt is írhatunk szóközzel elválasztva, például www ggg zzz. A classList segítségével eltávolíthatjuk, például a ggg osztályt anélkül, hogy megzavarnánk a többi osztályt.

Szintaxis

javascriptelem.classList;

Példa . Osztályok száma

Határozzuk meg egy elem osztályainak számát:

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

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

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

A kód végrehajtásának eredménye:

javascript3

Példa . Osztályok bejárása

Jelenítsük meg sorban az elem osztályait:

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

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

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

A kód végrehajtásának eredménye:

javascript'www'
'ggg'
'zzz'

Lásd még