Attribut style de l'élément HTML DOM

Définition et utilisation

style L'attribut retourne la valeur de l'attribut style de l'élément sous forme d'objet CSSStyleDeclaration.

L'objet CSSStyleDeclaration contient toutes les propriétés de style en ligne de l'élément. Il ne contient pas dans <head> Toute propriété de style définie dans une partie ou dans tout autre fichier de style externe.

Point 1

Vous ne pouvez pas définir un tel style :

element.style = "color:red";

Vous devez utiliser un tel attribut CSS :

element.style.backgroundColor = "red";

Essayez-le vous-même

Point 2

La syntaxe JavaScript et CSS diffère légèrement :

backgroundColor / background-color

Veuillez consulter notre Guide complet de l'objet Style.

Point 3

Utilisez cette propriété style plutôt que Méthode setAttribute()pour éviter de couvrir d'autres attributs de l'attribut style.

Veuillez également consulter :

Tutoriel CSS

Manuel de référence CSS

Objet Style

Balise <style> HTML

Exemple

Exemple 1

Changer la couleur de "myH1" :

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

Essayez-le vous-même

Exemple 2

Obtenir la valeur de la bordure supérieure de "myP" :

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

Essayez-le vous-même

Syntaxe

Retourner l'attribut style :

element.style.property

Définir l'attribut style :

element.style.property = value

Valeur de l'attribut

Valeur Description
value

Spécifier la valeur de l'attribut.

Par exemple :

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

Valeur de retour

Type Description
Objet l'objet CSSStyleDeclaration de l'élément.

Support du navigateur

element.style C'est une caractéristique de DOM Level 2 (2001).

Tous les navigateurs le supportent complètement :

Chrome IE Edge Firefox Safari Opéra
Chrome IE Edge Firefox Safari Opéra
Prise en charge 9-11 Prise en charge Prise en charge Prise en charge Prise en charge