CSSStyleDeclaration
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Das CSSStyleDeclaration Interface ist die Basisklasse für Objekte, die CSS-Deklarationsblöcke mit unterschiedlichen unterstützten Sätzen von CSS-Stilinformationen repräsentieren:
CSSStyleProperties— CSS-Stile, die im Stylesheet (CSSStyleRule.style) deklariert sind, Inline-Stile für ein Element wieHTMLElement,SVGElement, undMathMLElement, oder der berechnete Stil für ein Element, der durchWindow.getComputedStyle()zurückgegeben wird.CSSPageDescriptors— Stile für CSS-at-rules.
Das Interface stellt Stilinformationen sowie verschiedene stilbezogene Methoden und Eigenschaften bereit.
Zum Beispiel bietet es getPropertyValue(), um den Wert einer durch einen Bindestrich benannten CSS-Eigenschaft wie border-top zu erhalten, die nicht direkt mit der Punktnotation zugänglich ist, weil sie Bindestriche in ihrem Namen enthält.
Hinweis:
Frühere Versionen der Spezifikation verwendeten CSSStyleDeclaration, um alle CSS-Deklarationsblöcke darzustellen, und einige Browser und Browserversionen tun dies möglicherweise immer 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 funktional sein, aber einige Eigenschaften, die in einem CSSStyleDeclaration zurückgegeben werden, sind möglicherweise in einem bestimmten Kontext nicht relevant.
Attribute
CSSStyleDeclaration.cssText-
Textuelle Darstellung des Deklarationsblocks, wenn und nur dann, wenn er über
HTMLElement.styleausgesetzt wird. Das Setzen dieses Attributs ändert den Inline-Stil. Wenn Sie eine Textdarstellung eines berechneten Deklarationsblocks wünschen, können Sie sie mitJSON.stringify()erhalten. CSSStyleDeclaration.lengthSchreibgeschützt-
Die Anzahl der Eigenschaften. Siehe die Methode
item()unten. CSSStyleDeclaration.parentRuleSchreibgeschützt-
Die enthaltende
CSSRule.
CSS-Eigenschaften
CSSStyleDeclaration.cssFloatVeraltet-
Spezieller Alias für die
floatCSS-Eigenschaft. CSSStyleDeclarationbenannte Eigenschaften-
Mit Bindestrichen 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 Eigenschaftsnamen zurück.
CSSStyleDeclaration.item()-
Gibt einen CSS-Eigenschaftsnamen durch seinen 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 bestehende CSS-Eigenschaft oder erstellt eine neue CSS-Eigenschaft im Deklarationsblock.
CSSStyleDeclaration.getPropertyCSSValue()Veraltet-
Nur unterstützt über getComputedStyle in Firefox. Gibt den Eigenschaftswert als
CSSPrimitiveValueodernullfür Shorthand-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 |