classList-objektan toggle-metodi
toggle-metodi classList-objektissa
vuorottelee annetun CSS-luokan elementillä: lisää
luokan, jos sitä ei ole ja poistaa, jos se on.
Syntaksi
element.classList.contains(class);
Esimerkki
Tässä esimerkissä toggle-metodia käytettäessä luokka
zzz poistetaan, koska
se on jo elementissä:
<p id="elem" class="www ggg zzz"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
Koodin suorituksen tulos:
<p id="elem" class="www ggg"></p>
Esimerkki
Tässä esimerkissä toggle-metodia käytettäessä luokka
zzz lisätään, koska
sitä ei ole elementissä:
<p id="elem" class="www ggg"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
Koodin suorituksen tulos:
<p id="elem" class="www ggg zzz"></p>
Katso myös
-
classList.add-metodi,
joka lisää annetun luokan -
classList.remove-metodi,
joka poistaa annetun luokan -
classList.contains-metodi,
joka tarkistaa annetun luokan
