Methode toggleClass
De methode toggleClass wisselt tussen het toevoegen/verwijderen
van een CSS-klasse: als deze niet aanwezig is - wordt deze toegevoegd, als deze wel aanwezig is - wordt deze verwijderd.
Syntaxis
Één CSS-klasse:
$(selector).toggleClass(klassenaam);
Alleen een CSS-klasse toevoegen of verwijderen afhankelijk
van de tweede parameter, die de waarden
true of false accepteert:
$(selector).toggleClass(CSS-klassenaam, status);
Meerdere CSS-klassen:
$(selector).toggleClass(['klasse1', 'klasse2', 'klasse3', '...']);
Alleen CSS-klassen toevoegen of verwijderen afhankelijk van de tweede parameter:
$(selector).toggleClass(['klasse1', 'klasse2', 'klasse3', '...'], status');
Toepassen van een functie op elk element in de set,
status kan true of false zijn,
en geeft de methode aan - alleen toevoegen of alleen
verwijderen van de CSS-klasse:
$(selector).toggleClass(function(index in set, huidige klassen van element, status), [status]);
Voorbeeld
Onze paragraaf heeft al twee klassen. Laten we
er nog de klasse www aan toevoegen:
<p id="test" class="eee ggg">tekst</p>
$('#test').toggleClass('www');
De HTML-code ziet er dan zo uit:
<p id="test" class="eee ggg www">tekst</p>
Voorbeeld
En nu is de klasse www al aanwezig in het element
- laten we deze verwijderen:
<p id="test" class="eee ggg www">tekst</p>
$('#test').toggleClass('www');
De HTML-code ziet er dan zo uit:
<p id="test" class="eee ggg">tekst</p>
Zie ook
-
methoden
addClass,removeClass,hasClass -
JavaScript eigenschap
classList,
waarmee je het toevoegen/verwijderen van een klasse kunt afwisselen in pure JavaScript
