Die Methode toggle des classList-Objekts
Die Methode toggle des Objekts classList
schaltet eine bestimmte CSS-Klasse eines Elements um: Sie fügt die
Klasse hinzu, wenn sie nicht vorhanden ist, und entfernt sie, wenn sie vorhanden ist.
Syntax
element.classList.toggle(klasse);
Beispiel
In diesem Beispiel wird bei Verwendung der Methode
toggle die Klasse zzz entfernt, da
sie im Element bereits vorhanden ist:
<p id="elem" class="www ggg zzz"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
Ergebnis der Codeausführung:
<p id="elem" class="www ggg"></p>
Beispiel
In diesem Beispiel wird bei Verwendung der Methode
toggle die Klasse zzz hinzugefügt, da
sie im Element nicht vorhanden ist:
<p id="elem" class="www ggg"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
Ergebnis der Codeausführung:
<p id="elem" class="www ggg zzz"></p>
Siehe auch
-
die Methode
classList.add,
die eine bestimmte Klasse hinzufügt -
die Methode
classList.remove,
die eine bestimmte Klasse entfernt -
die Methode
classList.contains,
die eine bestimmte Klasse prüft
