CSSLayerStatementRule: nameList property

The read-only nameList property of the CSSLayerStatementRule interface return the list of associated cascade layer names. The names can’t be modified.

Value

An Array of strings, each representing a cascade layer represented by the @layer statement rule.

Examples

HTML

<div></div>

CSS

@layer layerName, layerName2;

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

JavaScript

const item = document.getElementsByTagName("div")[0];
const rules = document.getElementById("css-output").sheet.cssRules;

const layerStatementRule = rules[0]; // A CSSLayerStatementRule
const layerBlockRule = rules[1]; // A CSSLayerBlockRule; no nameList property.

item.textContent = `@layer declares the following layers: ${layerStatementRule.nameList.join(
  ", ",
)}.`;

Specifications

Browser compatibility

See also

• name
• @layer
• The @layer statement at-rule for named layers