Element.className

La proprietà className dell'interfaccia Element ottiene e imposta il valore dell'attributo class dell'elemento specificato.

Sintassi

var cName = elementNodeReference.className;
elementNodeReference.className = cName;
  • cName è una variabile stringa che rappresenta le classi o le classi separate dallo spazio dell'elemento corrente.

Esempio

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

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

Appunti

Il nome className viene utilizzato per questa proprietà anziché class a causa di conflitti con la parola chiave "class" in molti linguaggi che vengono utilizzati per manipolare il DOM.

className può anche essere un'istanza di SVGAnimatedString se element è un SVGElement. È meglio ottenere/impostare className di un elemento usando Element.getAttribute e Element.setAttribute se si ha a che fare con elementi SVG. Tuttavia, tieni presente che Element.getAttribute ritorna null anzichè "" se element ha un attributo class vuoto.

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

class è un Attributo HTML, mentre className è una proprietà del DOM.

Specifiche

Specifica Stato Commento
DOM
The definition of 'element.className' in that specification.
Living Standard  
DOM4
The definition of 'element.className' in that specification.
Obsolete  
Document Object Model (DOM) Level 2 HTML Specification
The definition of 'element.className' in that specification.
Obsolete Definizione iniziale

Compatibilità con i browser

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
classNameChrome Full support 43Edge Full support 13Firefox Full support YesIE Full support YesOpera Full support YesSafari Full support 6WebView Android Full support 43Chrome Android Full support 43Firefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes

Legend

Full support  
Full support

Vedi anche