Résumé

className définit et obtient la valeur de l'attribut class de l'élément spécifié.

Syntaxe

var cName = elementNodeReference.className;
elementNodeReference.className = cName;
  • cName est une String (chaîne de caractères) représentant la classe (ou les classes séparées par des espaces) de l'élément courant.

Exemple

let elm = document.getElementById('item');

if(elm.className === 'active'){
    elm.className = 'inactive';
} else {
    elm.className = 'active';
}

Notes

Le nom className est utilisé pour cette propriété au lieu de class à cause de conflits éventuels avec le mot-clé « class » dans beaucoup de langages utilisés pour manipuler le DOM.

className peut être une instance de SVGAnimatedString si l'element est un SVGElement. Dans ce cas là, l'usage de className ne fonctionnera pas, il sera donc préférable d'utiliser Element.getAttribute et Element.setAttribute si vous utilisez des élements SVG. 

elm.setAttribute('class', elm.getAttribute('class'))

Spécifications

Spécification Statut Commentaire
DOM
La définition de 'element.className' dans cette spécification.
Standard évolutif  
DOM4
La définition de 'element.className' dans cette spécification.
Obsolete  
Document Object Model (DOM) Level 2 HTML Specification
La définition de 'element.className' dans cette spécification.
Obsolete Définition initiale.

Compatibilité des navigateurs

Nous convertissons les données de compatibilité dans un format JSON. Ce tableau de compatibilité utilise encore l'ancien format car nous n'avons pas encore converti les données qu'il contient. Vous pouvez nous aider en contribuant !

Fonctionnalité Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support (Oui) (Oui) (Oui) (Oui) (Oui) (Oui)
Fonctionnalité Android webview Chrome for Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Oui) (Oui) (Oui) (Oui) (Oui) (Oui) (Oui)

Voir aussi

Étiquettes et contributeurs liés au document

Étiquettes : 
Dernière mise à jour par : loella16,