CSSStyleRule: style-Eigenschaft
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.
Die schreibgeschützte style-Eigenschaft der CSSStyleRule-Schnittstelle enthält ein CSSStyleProperties-Objekt, das die Eigenschaftenliste im Körper dieser Stilregel darstellt.
Jede vom Browser unterstützte CSS-Eigenschaft ist im Objekt vorhanden. Die Eigenschaften, die nicht inline in der entsprechenden CSS-Deklaration definiert sind, werden auf den leeren String ("") gesetzt.
Wert
Ein CSSStyleProperties-Objekt.
Hinweis:
Frühere Versionen der Spezifikation gaben ein CSSStyleDeclaration zurück, das jetzt die Basisklasse von CSSStyleProperties ist.
Siehe die Tabelle zur Browser-Kompatibilität für Informationen zur Browser-Unterstützung.
Obwohl die style-Eigenschaft selbst in dem Sinne schreibgeschützt ist, dass Sie das CSSStyleProperties-Objekt nicht ersetzen können, können Sie der style-Eigenschaft direkt Werte zuweisen, was dem Zuweisen zur cssText-Eigenschaft entspricht. Sie können das CSSStyleProperties-Objekt auch mit den Methoden setProperty() und removeProperty() modifizieren.
Beispiele
>Abrufen der Stile für eine Stilregel
Das untenstehende CSS definiert die Stilregel für den h1-Selektor, der im Code durch eine Instanz von CSSStyleRule dargestellt wird. Der Deklarationsblock ist der Teil der Stilregel, der innerhalb der geschweiften Klammern erscheint und tatsächlich die Stildefinitionen bereitstellt (für den Selektor, der Teil, der vor den Klammern kommt), der im Code durch die style-Eigenschaft dargestellt wird.
h1 {
color: pink;
}
Angenommen, die obige Stilregel ist die erste Regel im Dokument, wird sie die erste von document.styleSheets[0].cssRules zurückgegebene CSSRule sein. myRules[0].style gibt ein CSSStyleProperties-Objekt zurück, das die für h1 definierten Deklarationen darstellt.
const myRules = document.styleSheets[0].cssRules;
console.log(myRules[0].style); // a CSSStyleProperties representing the declarations on the h1.
Spezifikationen
| Specification |
|---|
| CSS Object Model (CSSOM)> # dom-cssstylerule-style> |