CSSStyleDeclaration

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.

* Some parts of this feature may have varying levels of support.

Das CSSStyleDeclaration Interface repräsentiert ein Objekt, das ein CSS-Deklarationsblock ist und Stilinformationen sowie verschiedene stilbezogene Methoden und Eigenschaften bereitstellt.

Ein CSSStyleDeclaration Objekt kann über drei verschiedene APIs verfügbar gemacht werden:

Über HTMLElement.style, welches sich mit den Inline-Stilen eines einzelnen Elements beschäftigt (z. B. <div style="…">).
Über die CSSStyleSheet API. Zum Beispiel gibt document.styleSheets[0].cssRules[0].style ein CSSStyleDeclaration Objekt für die erste CSS-Regel im ersten Stylesheet des Dokuments zurück.
Über Window.getComputedStyle(), welches das CSSStyleDeclaration Objekt als eine schreibgeschützte Schnittstelle bereitstellt.

Attribute

CSSStyleDeclaration.cssText: Textuelle Darstellung des Deklarationsblocks, sofern und nur sofern es über HTMLElement.style verfügbar gemacht wird. Das Setzen dieses Attributs ändert den Inline-Stil. Wenn Sie eine Textdarstellung eines berechneten Deklarationsblocks wünschen, können Sie diese mit JSON.stringify() erhalten.
CSSStyleDeclaration.length Schreibgeschützt: Die Anzahl der Eigenschaften. Siehe die item() Methode unten.
CSSStyleDeclaration.parentRule Schreibgeschützt: Die umgebende CSSRule.

CSS-Eigenschaften

CSSStyleDeclaration.cssFloat: Spezieller Alias für die float CSS-Eigenschaft.
CSSStyleDeclaration benannte Eigenschaften: Durch Bindestriche getrennte und camel-cased Attribute für alle unterstützten CSS-Eigenschaften.

Instanzmethoden

CSSStyleDeclaration.getPropertyPriority(): Gibt die optionale Priorität "important" zurück.
CSSStyleDeclaration.getPropertyValue(): Gibt den Eigenschaftswert für einen gegebenen Eigenschaftsnamen zurück.
CSSStyleDeclaration.item(): Gibt einen CSS-Eigenschaftsnamen anhand seines Indexes zurück, oder den leeren String, wenn der Index außerhalb des Bereichs liegt.
CSSStyleDeclaration.removeProperty(): Entfernt eine Eigenschaft aus dem CSS-Deklarationsblock.
CSSStyleDeclaration.setProperty(): Ändert eine bestehende CSS-Eigenschaft oder erstellt eine neue CSS-Eigenschaft im Deklarationsblock.
CSSStyleDeclaration.getPropertyCSSValue() Veraltet: Nur über getComputedStyle in Firefox unterstützt. Gibt den Eigenschaftswert als CSSPrimitiveValue oder null für Kurzschreibweise-Eigenschaften zurück.

Beispiel

const styleObj = document.styleSheets[0].cssRules[0].style;
console.log(styleObj.cssText);

for (let i = styleObj.length; i--; ) {
  const nameString = styleObj[i];
  styleObj.removeProperty(nameString);
}

console.log(styleObj.cssText);

Spezifikationen

Specification
CSS Object Model (CSSOM) # the-cssstyledeclaration-interface