Miten lisätä luokka

Opi, miten lisäät luokan JavaScriptilla elementtiin.

Napsauta painiketta ja lisää luokkani!

lisää luokka

Vaihe 1 - Lisää HTML:

Lisää luokka id="myDIV" div-elementtiin (tässä esimerkissä käytämme painiketta luokan lisäämiseen).

<button onclick="myFunction()">Kokeile</button>
<div id="myDIV">
  Tämä on DIV-elementti.
</div>

Vaihe 2 - Lisää CSS:

Aseta määritetyn luokan tyylit:

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

Vaihe 3 - Lisää JavaScript:

hanki id="myDIV" <div>-elementtiä, ja lisää siihen "mystyle" luokka:

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

kokeile itse

liittyvät sivut

oppaasti:Kuinka vaihtaa luokkaa

oppaasti:Kuinka poistaa luokka

viittausoppaat:HTML DOM Element classList ominaisuus

viittausoppaat:HTML DOM Element className ominaisuus