StyleSheetList
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 StyleSheetList-Interface repräsentiert eine Liste von CSSStyleSheet-Objekten. Eine Instanz dieses Objekts kann durch Document.styleSheets zurückgegeben werden.
Es handelt sich um ein array-ähnliches Objekt, das jedoch nicht mit Array-Methoden iteriert werden kann. Es kann jedoch in einer standardmäßigen for-Schleife über seine Indizes iteriert oder in ein Array umgewandelt werden.
Hinweis:
Typischerweise umschließen Listen-Interfaces wie StyleSheetList Array-Typen, sodass Sie Array-Methoden darauf verwenden können.
Dies ist hier aus historischen Gründen nicht der Fall.
Sie können jedoch StyleSheetList in ein Array umwandeln, um diese Methoden zu verwenden (siehe das Beispiel unten).
Instanz-Eigenschaften
StyleSheetList.lengthSchreibgeschützt-
Gibt die Anzahl der
CSSStyleSheet-Objekte in der Sammlung zurück.
Instanz-Methoden
StyleSheetList.item()-
Gibt das
CSSStyleSheet-Objekt am übergebenen Index zurück odernull, wenn kein Element für diesen Index existiert.
Beispiele
CSSStyleSheet-Objekte mit einer for-Schleife erhalten
for (const styleSheet of document.styleSheets) {
console.log(styleSheet); // A CSSStyleSheet object
}
Alle CSS-Regeln für das Dokument mit Array-Methoden abrufen
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,
);
return undefined;
}
})
.filter(Boolean)
.join("\n");
Spezifikationen
| Specification |
|---|
| CSS Object Model (CSSOM) # the-stylesheetlist-interface |
Browser-Kompatibilität
Loading…