Attributo style dell'elemento HTML DOM

Definizione e uso

style L'attributo restituisce il valore dell'attributo style dell'elemento come oggetto CSSStyleDeclaration.

L'oggetto CSSStyleDeclaration contiene tutti gli attributi di stile inline dell'elemento. Non contiene quelli in <head> qualsiasi attributo di stile impostato in parte o in qualsiasi foglio di stile esterno.

Punto 1

Non puoi impostare uno stile come questo:

element.style = "color:red";

Devi utilizzare tali attributi CSS:

element.style.backgroundColor = "red";

Prova tu stesso

Punto 2

La sintassi JavaScript e CSS è leggermente diversa:

backgroundColor / background-color

Vedi anche la nostra Manuale completo dell'oggetto Style.

Punto 3

Usa questo attributo style invece di Metodo setAttribute()per prevenire la sovrascrittura di altri attributi dell'attributo style.

Vedi anche:

Corso CSS

Manuale di riferimento CSS

Oggetto Style

Tag <style> HTML

Esempio

Esempio 1

Cambia il colore di "myH1":

document.getElementById("myH1").style.color = "red";

Prova tu stesso

Esempio 2

Ottieni il valore del bordo superiore di "myP":

let value = document.getElementById("myP").style.borderTop;

Prova tu stesso

Sintassi

Ritornare l'attributo style:

element.style.property

Impostare l'attributo style:

element.style.property = value

Valore dell'attributo

Valore Descrizione
value

Specificare il valore dell'attributo.

Ad esempio:

element.style.borderBottom = "2px solid red"

Valore di ritorno

Tipo Descrizione
Oggetto L'oggetto CSSStyleDeclaration dell'elemento.

Supporto del browser

element.style È una caratteristica di DOM Level 2 (2001).

Tutti i browser lo supportano completamente:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Supporto 9-11 Supporto Supporto Supporto Supporto