De classList Eigenschap

De eigenschap classList bevat een pseudo-array van CSS-klassen van het element, en maakt het ook mogelijk om klassen toe te voegen en te verwijderen, en de aanwezigheid van een specifieke klasse te controleren.

Het gaat over het class attribuut, waarin je meerdere klassen kunt schrijven, gescheiden door spaties, bijvoorbeeld www ggg zzz. Met classList kun je bijvoorbeeld de klasse ggg verwijderen, zonder de andere klassen aan te raken.

Syntaxis

javascriptelement.classList;

Voorbeeld . Aantal klassen

Laten we het aantal klassen van het element achterhalen:

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

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

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

Resultaat van de code:

javascript3

Voorbeeld . Klassen doorlopen

Laten we de klassen van het element een voor een weergeven:

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

Resultaat van de code:

javascript'www'
'ggg'
'zzz'

Zie ook