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…