CSSStyleDeclaration
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Das CSSStyleDeclaration Interface ist die Basisklasse für Objekte, die CSS-Deklarationsblöcke mit unterschiedlichen unterstützten Sets von CSS-Stilinformationen repräsentieren:
CSSStyleProperties— CSS-Stile, die im Stylesheet deklariert sind (CSSStyleRule.style), Inline-Stile für ein Element wieHTMLElement,SVGElementundMathMLElement, oder der berechnete Stil eines Elements, zurückgegeben durchWindow.getComputedStyle().CSSPageDescriptors— Stile für CSS at-rules.
Das Interface bietet Stilinformationen sowie verschiedene stilbezogene Methoden und Eigenschaften. Zum Beispiel bietet es getPropertyValue() für das Abrufen des Wertes einer mit Bindestrich benannten CSS-Eigenschaft, wie border-top, die wegen der Bindestriche im Namen nicht direkt über die Punkt-Notation zugänglich ist.
Hinweis:
Frühere Versionen der Spezifikation nutzten CSSStyleDeclaration, um alle CSS-Deklarationsblöcke darzustellen, und einige Browser und Browserversionen tun dies möglicherweise noch (überprüfen Sie die Browser-Kompatibilitätstabellen für die oben genannten APIs).
Im Allgemeinen wird derselbe Website-Code sowohl in alten als auch in neuen Versionen funktionieren, jedoch könnten einige in einer CSSStyleDeclaration zurückgegebene Eigenschaften in einem bestimmten Kontext nicht relevant sein.
Attribute
CSSStyleDeclaration.cssText-
Textuelle Darstellung des Deklarationsblocks, wenn und nur wenn er über
HTMLElement.styleexponiert wird. Das Setzen dieses Attributs ändert den Inline-Stil. Wenn Sie eine Textdarstellung eines berechneten Deklarationsblocks möchten, können Sie diese mitJSON.stringify()erhalten. CSSStyleDeclaration.lengthSchreibgeschützt-
Die Anzahl der Eigenschaften. Siehe die Methode
item()unten. CSSStyleDeclaration.parentRuleSchreibgeschützt-
Die beinhaltende
CSSRule.
CSS-Eigenschaften
CSSStyleDeclaration.cssFloat-
Spezieller Alias für die
floatCSS-Eigenschaft. CSSStyleDeclarationbenannte Eigenschaften-
Mit Bindestrich und in Camel-Case geschriebene Attribute für alle unterstützten CSS-Eigenschaften.
Instanzmethoden
CSSStyleDeclaration.getPropertyPriority()-
Gibt die optionale Priorität zurück, "important".
CSSStyleDeclaration.getPropertyValue()-
Gibt den Eigenschaftswert für einen Eigenschaftsnamen zurück.
CSSStyleDeclaration.item()-
Gibt einen CSS-Eigenschaftsnamen nach seinem Index zurück oder einen leeren String, wenn der Index außerhalb des Bereichs liegt.
CSSStyleDeclaration.removeProperty()-
Entfernt eine Eigenschaft aus dem CSS-Deklarationsblock.
CSSStyleDeclaration.setProperty()-
Ändert eine vorhandene CSS-Eigenschaft oder erstellt eine neue CSS-Eigenschaft im Deklarationsblock.
CSSStyleDeclaration.getPropertyCSSValue()-
Nur in Firefox über getComputedStyle unterstützt. Gibt den Eigenschaftswert als
CSSPrimitiveValueodernullfü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
| Spezifikation |
|---|
| CSS Object Model (CSSOM) # the-cssstyledeclaration-interface |