Dokument: styleSheets-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 styleSheets-Eigenschaft des Document-Interfaces gibt eine StyleSheetList von CSSStyleSheet-Objekten zurück, für Stylesheets, die explizit in ein Dokument verlinkt oder eingebettet sind.
Wert
Die zurückgegebene Liste ist folgendermaßen geordnet:
- StyleSheets, die über
Link-Header abgerufen wurden, werden zuerst platziert und in der Reihenfolge der Header sortiert. - StyleSheets, die aus dem DOM abgerufen wurden, werden danach platziert und in Baumreihenfolge sortiert.
Beispiele
Abrufen eines bestimmten Stylesheets nach seinem Titel
function getStyleSheet(uniqueTitle) {
for (const sheet of document.styleSheets) {
if (sheet.title === uniqueTitle) {
return sheet;
}
}
}
Zugriff auf Regeln im Stylesheet
Sie können auf diese Stylesheets und ihre Regeln einzeln zugreifen, indem Sie die Objekte stylesheet, style und CSSRule verwenden, wie in diesem Beispiel gezeigt wird, das alle Stilregel-Selektoren in die Konsole ausgibt.
for (const styleSheet of document.styleSheets) {
for (const rule of styleSheet.cssRules) {
console.log(`${rule.selectorText}\n`);
}
}
Für ein Dokument mit einem einzelnen Stylesheet, in dem die folgenden drei Regeln definiert sind:
body {
background-color: darkblue;
}
p {
font-family: "Arial";
font-size: 10pt;
margin-left: 0.125in;
}
#lumpy {
display: none;
}
Gibt dieses Skript Folgendes aus:
BODY P #LUMPY
Spezifikationen
| Specification |
|---|
| CSS Object Model (CSSOM) # dom-documentorshadowroot-stylesheets |
Browser-Kompatibilität
Loading…