Properti classList

Properti classList berisi pseudo-array kelas CSS elemen, serta memungkinkan untuk menambah dan menghapus kelas elemen, memeriksa keberadaan kelas tertentu di antara kelas-kelas elemen.

Yang dimaksud adalah atribut class, di dalamnya dapat ditulis beberapa kelas dipisahkan oleh spasi, contohnya www ggg zzz. Dengan menggunakan classList dapat menghapus, contohnya, kelas ggg, tanpa mempengaruhi kelas-kelas lainnya.

Sintaks

elemen.classList;

Contoh . Jumlah Kelas

Mari kita ketahui jumlah kelas elemen:

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

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

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

Hasil eksekusi kode:

3

Contoh . Mengiterasi Kelas

Mari kita tampilkan kelas-kelas elemen satu per satu:

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

Hasil eksekusi kode:

'www'
'ggg'
'zzz'

Lihat Juga

metode classList.add,
yang menambahkan kelas yang ditentukan
metode classList.remove,
yang menghapus kelas yang ditentukan
metode classList.contains,
yang memeriksa kelas yang ditentukan
metode classList.toggle,
yang menggilir (menambah/hapus) kelas yang ditentukan