Proprietatea classList

Proprietatea classList conține un pseudo-array al claselor CSS ale elementului și, de asemenea, permite adăugarea și eliminarea claselor elementului, verificarea prezenței unei anumite clase între clasele elementului.

Vorbim despre atributul class, în interiorul căruia se pot scrie mai multe clase separate prin spațiu, de exemplu www ggg zzz. Cu ajutorul classList se poate elimina, de exemplu, clasa ggg, fără a afecta celelalte clase.

Sintaxă

javascriptelement.classList;

Exemplul . Numărul de clase

Aflăm numărul de clase ale elementului:

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

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

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

Rezultatul executării codului:

javascript3

Exemplul . Iterăm prin clase

Afișăm pe rând clasele elementului:

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

Rezultatul executării codului:

javascript'www'
'ggg'
'zzz'

Veți și