თვისება classList

თვისება classList შეიცავს ფსევდომასივს ელემენტის CSS კლასების, ასევე საშუალებას გაძლევს დაამატო და წაშალო ელემენტის კლასები, შეამოწმო კონკრეტული კლასის არსებობა ელემენტის კლასებს შორის.

საუბარია ატრიბუტ class-ზე, რომლის შიგნითაც შესაძლებელია რამდენიმე კლასის დაწერა გამოტოვებით, მაგალითად www ggg zzz. classList-ის საშუალებით შესაძლებელია წაშალო, მაგალითად, კლასი ggg, სხვა კლასების შეუხებლად.

სინტაქსი

ელემენტი.classList;

მაგალითი . კლასების რაოდენობა

გავიგოთ ელემენტის კლასების რაოდენობა:

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

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

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

კოდის შესრულების შედეგი:

3

მაგალითი . კლასების გადავლა

გამოვიტანოთ ელემენტის კლასები სათითაოდ:

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

კოდის შესრულების შედეგი:

'www'
'ggg'
'zzz'

იხილეთ აგრეთვე

მეთოდი classList.add,
რომელიც ამატებს მოცემულ კლასს
მეთოდი classList.remove,
რომელიც შლის მოცემულ კლასს
მეთოდი classList.contains,
რომელიც ამოწმებს მოცემულ კლასს
მეთოდი classList.toggle,
რომელიც მონაცვლეობით ჩართავს/ან თიშავს მოცემულ კლასს