classList Eienskap

Die eienskap classList bevat 'n pseudoversameling van die element se CSS klasse, en laat ook toe om klasse by te voeg en te verwyder, en om die teenwoordigheid van 'n spesifieke klas onder die element se klasse te toets.

Dit verwys na die class attribuut, binne-in wat jy verskeie klasse kan skryf met spasies daartussen, byvoorbeeld www ggg zzz. Met behulp van classList kan jy byvoorbeeld die klas ggg verwyder, sonder om die ander klasse te raak.

Sintaksis

element.classList;

Voorbeeld . Aantal Klasse

Kom ons vind uit hoeveel klasse die element het:

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

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

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

Resultaat van die kode-uitvoering:

3

Voorbeeld . Herhaal deur klasse

Kom ons toon die element se klasse een vir een:

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

Resultaat van die kode-uitvoering:

'www'
'ggg'
'zzz'

Sien ook

metode classList.add,
wat die gegewe klas byvoeg
metode classList.remove,
wat die gegewe klas verwyder
metode classList.contains,
wat die gegewe klas toets
metode classList.toggle,
wat die gegewe klas wissel