Yksi luokka tyylittelyyn JavaScriptissä

Oletetaan, että meillä on kaksi luokkaa, jotka annamme elementille sen tilasta riippuen:

cssdiv.active {
  color: red;
}
div.passive {
  color: black;
}

Itse asiassa kahden luokan läsnäolo täällä voi olla häiritsevää. Tässä tapauksessa voimme kirjoittaa tyylit uudelleen seuraavasti valitsimen :not avulla:

cssdiv.active {
  color: red;
}
div:not(active) {
  color: black;
}

Tässä tapauksessa voimme kätevällä tavalla toggleoida luokkaamme, tehdä elementistä aktiivisen tai ei-aktiivisen:

javascriptelem.classList.toggle('active');