Egy osztály a stílusozáshoz JavaScriptben

Tegyük fel, hogy van két osztályunk, amelyeket az elem állapotától függően adunk neki:

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

Valójában a két osztály jelenléte itt zavaró lehet. Ebben az esetben átírhatjuk a stílusokat a következő módon a :not szelektor segítségével:

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

Ebben az esetben kényelmes módon tudjuk váltogatni az osztályunkat, ezzel aktívvá vagy inaktívvá téve az elemet:

javascriptelem.classList.toggle('active');