CSSStyleSheet: addRule() Methode

Veraltet: Diese Funktion wird nicht mehr empfohlen. Obwohl einige Browser sie möglicherweise noch unterstützen, könnte sie bereits aus den relevanten Webstandards entfernt worden sein, in Kürze entfernt werden oder nur noch aus Kompatibilitätsgründen bestehen. Vermeiden Sie die Verwendung und aktualisieren Sie vorhandenen Code, falls möglich; siehe die Kompatibilitätstabelle am Ende dieser Seite, um Ihre Entscheidung zu unterstützen. Beachten Sie, dass diese Funktion jederzeit aufhören könnte zu funktionieren.

Die veraltete Schnittstelle CSSStyleSheet verwendet die addRule() Legacy-Methode, um eine neue Regel zum Stylesheet hinzuzufügen. Sie sollten diese Methode vermeiden und stattdessen die standardmäßigere insertRule() Methode verwenden.

Syntax

addRule(selector, styleBlock, index)

Parameter

selector: Ein Zeichenfolgenwert, der den Selektoranteil der CSS-Regel angibt. Der Standardwert ist die Zeichenfolge undefined.
styleBlock: Eine Zeichenfolge, die den Stilblock angibt, der auf Elemente angewendet werden soll, die dem selector entsprechen. Der Standardwert ist die Zeichenfolge undefined.
index Optional: Ein optionaler Index in der CSSRuleList des Stylesheets, an dem die neue Regel eingefügt werden soll. Wird index nicht angegeben, wird der nächste Index nach dem letzten Element in der Liste verwendet (also der Wert von cssStyleSheet.cssRules.length).

Rückgabewert

Gibt immer -1 zurück.

Beachten Sie, dass es aufgrund von etwas exotischen Regeln darüber, wo Sie legal Regeln einfügen können, möglich ist, dass eine Ausnahme ausgelöst wird. Weitere Informationen finden Sie unter insertRule().

Verwendungshinweise

Diese Methode wird von Browsern implementiert, indem ein String unter Verwendung des Template-Literals `${selector}{${styleBlock}}` konstruiert und dann in die standardmäßige insertRule() Methode übergeben wird.

Daher kann der bestehende Code wie folgt umgeschrieben werden:

cssStyleSheet.addRule(selector, styles, 0);

Sie können dies umschreiben und die standardmäßigere insertRule() Methode wie folgt verwenden:

cssStyleSheet.insertRule(`${selector} {${styles}}`, 0);

Spezifikationen

Specification
CSS Object Model (CSSOM) # dom-cssstylesheet-addrule

Browser-Kompatibilität

BCD tables only load in the browser