Hoe klassen wisselen

Klasse wisselen

Eerste stap - Voeg HTML toe:

Voeg de klasse toe aan id="myDIV" wissel tussen de div-elementen (in dit voorbeeld gebruiken we een knop om de klasse te wisselen).

<button onclick="myFunction()">Probeer het zelf</button>
<div id="myDIV">
  Dit is een DIV-element.
</div>

Tweede stap - Voeg CSS toe:

Voeg een klasse toe om te wisselen:

.mystyle {
  width: 100%;
  padding: 25px;
  background-color: coral;
  color: white;
  font-size: 25px;
}

Derde stap - Voeg JavaScript toe:

verkrijg id="myDIV" van de <div> element, en "mystyle" Class wisselen tussen:

function myFunction() {
  var element = document.getElementById("myDIV");
  element.classList.toggle("mystyle");
}

Probeer het zelf

Gerelateerde pagina's

Handleiding:Hoe klasse toe te voegen

Handleiding:Hoe klasse te verwijderen

Referentiehandleiding:HTML DOM Element classList eigenschap