Gewusst wie: Klasse hinzufügen
Erfahren Sie, wie Sie einem Element mit JavaScript einen Klassennamen hinzufügen.
Klicken Sie auf die Schaltfläche, um mir eine Klasse hinzuzufügen!
Klasse hinzufügen
Schritt 1) HTML hinzufügen:
Fügen Sie dem div-Element mit id="myDIV" einen Klassennamen hinzu (in diesem Beispiel verwenden wir eine Schaltfläche, um die Klasse hinzuzufügen).
Beispiel
<button onclick="myFunction()">Try it</button>
<div id="myDIV">
This is a DIV element.
</div>
Schritt 2) CSS hinzufügen:
Gestalten Sie den angegebenen Klassennamen:
Beispiel
.mystyle {
width: 100%;
padding:
25px;
background-color: coral;
color: white;
font-size: 25px;
}
Schritt 3) JavaScript hinzufügen:
Holen Sie sich das Element <div> mit id="myDIV" und fügen Sie die Klasse "mystyle" hinzu:
Beispiel
function myFunction() {
var element = document.getElementById("myDIV");
element.classList.add("mystyle");
}
Tipp: Siehe auch How To Toggle A Class .
Tipp: Siehe auch So entfernen Sie eine Klasse .
Tipp: Erfahren Sie mehr über die classList- Eigenschaft in unserer JavaScript-Referenz.
Tipp: Erfahren Sie mehr über die className- Eigenschaft in unserer JavaScript-Referenz.