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 verschiedenen unterstützten Sets von CSS-Style-Informationen darstellen:
CSSStyleProperties— CSS-Styles, die in einem Stylesheet deklariert sind (CSSStyleRule.style), Inline-Styles für ein Element wieHTMLElement,SVGElementundMathMLElementoder den berechneten Stil für ein Element, der vonWindow.getComputedStyle()zurückgegeben wird.CSSPageDescriptors— Styles für CSS-at-rules.
Das Interface stellt Stil-Informationen sowie verschiedene methoden- und eigenschaftsbezogene Methoden bereit. Zum Beispiel bietet es getPropertyValue() an, um den Wert einer CSS-Eigenschaft mit Bindestrich im Namen, wie z.B. border-top, abzurufen, die nicht direkt per Punktnotation angesprochen werden kann, da sie Bindestriche im Namen enthält.
Hinweis:
Frühere Versionen der Spezifikation verwendeten CSSStyleDeclaration, um alle CSS-Deklarationsblöcke darzustellen, und einige Browser und Browserversionen könnten dies immer noch tun (prüfen Sie die Browser-Kompatibilitätstabellen für die oben genannten APIs). In der Regel wird derselbe Website-Code sowohl in alten als auch in neuen Versionen funktionsfähig sein, aber einige Eigenschaften, die in einem CSSStyleDeclaration zurückgegeben werden, könnten in einem bestimmten Kontext nicht relevant sein.
Attribute
CSSStyleDeclaration.cssText-
Textuelle Darstellung des Deklarationsblocks, wenn und nur wenn er über
HTMLElement.stylezugänglich ist. Das Setzen dieses Attributs verändert den Inline-Stil. Wenn Sie eine Textdarstellung eines berechneten Deklarationsblocks wünschen, können Sie diese mitJSON.stringify()erhalten. CSSStyleDeclaration.lengthSchreibgeschützt-
Die Anzahl der Eigenschaften. Siehe die
item()-Methode unten. CSSStyleDeclaration.parentRuleSchreibgeschützt-
Die enthaltende
CSSRule.
CSS-Eigenschaften
CSSStyleDeclaration.cssFloat-
Spezieller Alias für die
floatCSS-Eigenschaft. CSSStyleDeclarationbenannte Eigenschaften-
In Bindestrich- und Camel-Case-Schreibweise 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 Eigenschaftsnamen zurück.
CSSStyleDeclaration.item()-
Gibt einen CSS-Eigenschaftsnamen anhand seines Indexes zurück oder einen leeren String, wenn der Index außerhalb der Grenzen 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()-
Nur über getComputedStyle in Firefox unterstützt. Gibt den Eigenschaftswert als
CSSPrimitiveValueodernullfür Kurzschrift-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 |