StyleSheetList

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.

Das StyleSheetList Interface repräsentiert eine Liste von CSSStyleSheet Objekten. Eine Instanz dieses Objekts kann von Document.styleSheets zurückgegeben werden.

Es ist ein array-ähnliches Objekt, kann aber nicht mit Array Methoden durchlaufen werden. Es kann jedoch in einer Standardschleife mit for über seine Indizes durchlaufen oder in ein Array umgewandelt werden.

Hinweis: Typischerweise umfassen Listen-Interfaces wie StyleSheetList Array Typen, sodass Sie Array-Methoden auf ihnen verwenden können. Dies ist hier aus historischen Gründen nicht der Fall. Sie können StyleSheetList jedoch in ein Array umwandeln, um diese Methoden zu verwenden (siehe das Beispiel unten).

Instanz-Eigenschaften

StyleSheetList.length Schreibgeschützt

Gibt die Anzahl der CSSStyleSheet Objekte in der Sammlung zurück.

Instanz-Methoden

StyleSheetList.item()

Gibt das CSSStyleSheet Objekt an dem übergebenen Index zurück oder null, wenn kein Element für diesen Index existiert.

Beispiele

CSSStyleSheet Objekte mit einer for-Schleife abrufen

js
const styleSheet = [];
const styleSheets = document.styleSheets;

for (let i = 0; i < styleSheets.length; i++) {
  styleSheet.push(styleSheets[i]);
}

Alle CSS-Regeln für das Dokument mit Array-Methoden abrufen

js
const allCSS = [...document.styleSheets]
  .map((styleSheet) => {
    try {
      return [...styleSheet.cssRules].map((rule) => rule.cssText).join("");
    } catch (e) {
      console.log(
        "Access to stylesheet %s is denied. Ignoring…",
        styleSheet.href,
      );
    }
  })
  .filter(Boolean)
  .join("\n");

Spezifikationen

Specification
CSS Object Model (CSSOM)
# the-stylesheetlist-interface

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
StyleSheetList
item
length

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support