Eén klasse voor stilisering in JavaScript
Stel dat we twee klassen hebben die we aan een element geven afhankelijk van zijn toestand:
div.active {
color: red;
}
div.passive {
color: black;
}
Eigenlijk kan de aanwezigheid van twee klassen hier
in de weg zitten. In dat geval kunnen we
de stijlen als volgt herschrijven
via de selector :not:
div.active {
color: red;
}
div:not(active) {
color: black;
}
In dit geval kunnen we op een handige manier onze klasse wisselen, waardoor het element actief of inactief wordt:
elem.classList.toggle('active');
Er zijn alinea's. Zorg ervoor dat elke alinea bij de eerste klik erop rood kleurt, en bij de tweede klik - weer zwart kleurt.