StyleSheetList

StyleSheetList インターフェイスは StyleSheet のリストを表します。

これは配列風のオブジェクトですが、 Array のメソッドを適用しての反復処理はできません。しかし標準の for ループと添字による反復処理、もしくは Array への変換ができます。

例

for ループを使用して document の styleSheet オブジェクトを取得

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

Array のメソッドを適用してすべての CSS ルールを取得

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');

仕様書

仕様書	状態	備考
CSS Object Model (CSSOM) CSSStyleSheetList の定義	草案

ブラウザーの互換性

BCD tables only load in the browser