CSSImportRule: layerName property
Baseline: Widely supported
Baseline is determined by this web feature being supported on the current and the previous major versions of major browsers.
The read-only layerName
property of the CSSImportRule
interface returns the name of the cascade layer created by the @import
at-rule.
If the created layer is anonymous, the string is empty (""
), if no layer has been
created, it is the null
object.
Value
A string, that can be empty, or the null
object.
Examples
The document's single stylesheet contains three @import
rules. The first declaration imports a stylesheet into a named layer. The second declaration imports a stylesheet into an anonymous layer. The third declaration imports a stylesheet without a layer declaration.
The layerName
property returns the name of the layer associated with the imported
stylesheet.
css
@import url("style1.css") layer(layer-1);
@import url("style2.css") layer;
@import url("style3.css");
js
const myRules = document.styleSheets[0].cssRules;
console.log(myRules[0].layerName); // returns `"layer-1"`
console.log(myRules[1].layerName); // returns `""` (an anonymous layer)
console.log(myRules[2].layerName); // returns `null`
Specifications
Specification |
---|
CSS Object Model (CSSOM) # dom-cssimportrule-layername |
Browser compatibility
BCD tables only load in the browser
See also
- Learning area : Cascade layers
@import
and@layer