Comment - Ajouter une classe
Découvrez comment ajouter un nom de classe à un élément avec JavaScript.
Cliquez sur le bouton pour m'ajouter une classe !
Ajouter une classe
Étape 1) Ajoutez du HTML :
Ajoutez un nom de classe à l'élément div avec id="myDIV" (dans cet exemple, nous utilisons un bouton pour ajouter la classe).
Exemple
<button onclick="myFunction()">Try it</button>
<div id="myDIV">
This is a DIV element.
</div>
Étape 2) Ajoutez CSS :
Stylez le nom de classe spécifié :
Exemple
.mystyle {
width: 100%;
padding:
25px;
background-color: coral;
color: white;
font-size: 25px;
}
Étape 3) Ajoutez JavaScript :
Obtenez l'élément <div> avec id="myDIV" et ajoutez-y la classe "mystyle" :
Exemple
function myFunction() {
var element = document.getElementById("myDIV");
element.classList.add("mystyle");
}
Conseil : consultez également Comment basculer une classe .
Conseil : consultez également Comment supprimer une classe .
Conseil : En savoir plus sur la propriété classList dans notre référence JavaScript.
Astuce : En savoir plus sur la propriété className dans notre référence JavaScript.