Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

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

js
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.

js
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:

css
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