Methode toggleClass
Die Methode toggleClass wechselt das Hinzufügen/Entfernen
einer CSS-Klasse: Wenn sie nicht vorhanden ist, wird sie hinzugefügt, wenn sie vorhanden ist, wird sie entfernt.
Syntax
Eine CSS-Klasse:
$(Selektor).toggleClass(Klassenname);
CSS-Klasse nur hinzufügen oder entfernen, abhängig
vom zweiten Parameter, der die Werte
true oder false annimmt:
$(Selektor).toggleClass(CSS-Klassenname, Zustand);
Mehrere CSS-Klassen:
$(Selektor).toggleClass(['Klasse1', 'Klasse2', 'Klasse3', '...']);
CSS-Klassen nur hinzufügen oder entfernen, abhängig vom zweiten Parameter:
$(Selektor).toggleClass(['Klasse1', 'Klasse2', 'Klasse3', '...'], Zustand');
Anwendung einer Funktion auf jedes Element im Set,
der Zustand kann true oder false sein,
und weist der Methode an, die CSS-Klasse nur hinzuzufügen oder nur
zu entfernen:
$(Selektor).toggleClass(function(Index, aktuelle Klassen des Elements, Zustand), [Zustand]);
Beispiel
Unser Absatz hat bereits zwei Klassen. Lassen Sie uns
ihm zusätzlich die Klasse www hinzufügen:
<p id="test" class="eee ggg">text</p>
$('#test').toggleClass('www');
Der HTML-Code sieht dann so aus:
<p id="test" class="eee ggg www">text</p>
Beispiel
Jetzt ist die Klasse www bereits im Element vorhanden
- lassen Sie uns sie entfernen:
<p id="test" class="eee ggg www">text</p>
$('#test').toggleClass('www');
Der HTML-Code sieht dann so aus:
<p id="test" class="eee ggg">text</p>
Siehe auch
-
Methoden
addClass,removeClass,hasClass -
JavaScript-Eigenschaft
classList,
mit der das Hinzufügen/Entfernen einer Klasse in reinem JavaScript umgeschaltet werden kann
