CSSLayerStatementRule: nameList プロパティ

Baseline 2022

Newly available

Since March 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

nameList は CSSLayerStatementRule インターフェイスの読み取り専用プロパティで、関連づけられたカスケードレイヤーの名前のリストを返します。名前は変更できません。

値

文字列の配列 (Array) で、それぞれが @layer 文ルールで表されるカスケードレイヤーを表します。

例

HTML

html
<div></div>

CSS

css
@layer layerName, layerName2;

@layer layerName3 {
  div {
    font-family: serif;
  }
}

JavaScript

js
const item = document.getElementsByTagName("div")[0];
const rules = document.styleSheets[1].cssRules;
// スタイルシート #1 はこの埋め込み例に関連するスタイルシートであり、
// スタイルシート #0 は MDN ページ全体に関連するスタイルシート。

const layerStatementRule = rules[0]; // CSSLayerStatementRule
const layerBlockRule = rules[1]; // CSSLayerBlockRule には nameList プロパティがない

item.textContent = `@layer は ${layer.nameList.join(
  ", ",
)} レイヤーを宣言しています。`;

仕様書

Specification
CSS Cascading and Inheritance Level 5
# dom-csslayerstatementrule-namelist

ブラウザーの互換性

BCD tables only load in the browser

関連情報