Egenskapen classList

Egenskapen classList inneholder en pseudomatrise av elementets CSS-klasser, og lar deg også legge til og fjerne elementets klasser, sjekke tilstedeværelsen av en bestemt klasse blant elementets klasser.

Det dreier seg om attributtet class, innenfor hvilket man kan skrive flere klasser mellom mellomrom, for eksempel www ggg zzz. Ved hjelp av classList kan man fjerne, for eksempel, klassen ggg, uten å berøre de andre klassene.

Syntaks

element.classList;

Eksempel . Antall klasser

La oss finne ut antall klasser elementet har:

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

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

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

Resultat av kjøring av kode:

3

Eksempel . Går gjennom klassene

La oss skrive ut klassene til elementet en etter en:

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

Resultat av kjøring av kode:

'www'
'ggg'
'zzz'

Se også

metoden classList.add,
som legger til en angitt klasse
metoden classList.remove,
som fjerner en angitt klasse
metoden classList.contains,
som sjekker en angitt klasse
metoden classList.toggle,
som veksler en angitt klasse