HTML DOM Element style-Attribut

Definition und Verwendung

style Das Attribut gibt den Wert des style-Attributs des Elements zurück, als CSSStyleDeclaration-Objekt.

Das CSSStyleDeclaration-Objekt enthält alle inline-Style-Attribute des Elements. Es enthält nicht in <head> jegliche Style-Attribute, die in einem Teil oder einer jeden externen Stil-Tabelle gesetzt sind.

Punkt 1

Sie können solche Stile nicht setzen:

element.style = "color:red";

Sie müssen solche CSS-Attribute verwenden:

element.style.backgroundColor = "red";

Probieren Sie es selbst aus

Punkt 2

Die JavaScript-Syntax und die CSS-Syntax unterscheiden sich leicht:

backgroundColor / background-color

Siehe auch unsere Vollständiges Referenzhandbuch für Style-Objekt.

Punkt 3

Verwenden Sie diesen style-Attribut, anstatt setAttribute() Methode, um zu verhindern, dass andere Attribute im style-Attribut überschrieben werden.

Siehe auch:

CSS-Tutorial

CSS-Referenzhandbuch

Style-Objekt

HTML <style>-Tag

Beispiel

Beispiel 1

Ändern Sie die Farbe von "myH1":

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

Probieren Sie es selbst aus

Beispiel 2

Erhalten Sie den Wert der oberen Grenze von "myP":

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

Probieren Sie es selbst aus

Syntax

Geben Sie das style-Attribut zurück:

element.style.property

Setzen Sie das style-Attribut:

element.style.property = Wert

Eigenschaftswert

Wert Beschreibung
Wert

Geben Sie den Wert der Eigenschaft an.

Beispiel:

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

Rückgabewert

Typ Beschreibung
Objekt Das CSSStyleDeclaration-Objekt des Elements.

Browser-Unterstützung

element.style Es ist eine Eigenschaft von DOM Level 2 (2001).

Alle Browser unterstützen es vollständig:

Chrome IE Edge Firefox Safari Oper
Chrome IE Edge Firefox Safari Oper
Unterstützung 9-11 Unterstützung Unterstützung Unterstützung Unterstützung