CSSNestedDeclarations
CSSNestedDeclarations 接口是 CSS 规则 API 的一部分，用于组合嵌套的 CSSRule。
该接口允许 CSS 对象模型 (CSSOM) 镜像带有嵌套 CSS 规则的 CSS 文档结构，并确保规则按照声明的顺序被解析和评估。
注意：不支持此接口的实现可能会以错误的顺序解析嵌套规则。有关更多信息，请参阅 浏览器兼容性。
实例属性
继承自其祖先 CSSRule 的属性。
CSSNestedDeclarations.style只读-
返回嵌套规则的值。
实例方法
没有特定的方法；继承自其祖先 CSSRule 的方法。
示例
CSS
以下 CSS 包含一个选择器 .foo，其中包含两个声明和一个媒体查询。
css
.foo {
background-color: silver;
@media screen {
color: tomato;
}
color: black;
}
这在 CSS 对象模型 中由多个 JavaScript 对象表示。
- 一个
CSSStyleRule对象，表示background-color: silver规则。可以通过document.styleSheets[0].cssRules[0]返回。 - 一个
CSSMediaRule对象，表示@media screen规则，可以通过document.styleSheets[0].cssRules[0].cssRules[0]返回。CSSMediaRule对象包含一个CSSNestedDeclaration对象，该对象表示由@media screen规则嵌套的color: tomato规则。可以通过document.styleSheets[0].cssRules[0].cssRules[0].cssRules[0]返回。
- 最后一个规则是
CSSNestedDeclaration对象，表示样式表中的color: black规则，可以通过document.styleSheets[0].cssRules[0].cssRules[1]返回。
注意：在第一个 CSSNestedDeclaration 之后的所有顶层样式也必须表示为 CSSNestedDeclaration 对象，以遵循 CSS 嵌套声明规则。
CSSOM (CSS 对象模型)
↳ CSSStyleRule
.style
- background-color: silver
↳ CSSMediaRule
↳ CSSNestedDeclarations
.style (CSSStyleDeclaration, 1) =
- color: tomato
↳ CSSNestedDeclarations
.style (CSSStyleDeclaration, 1) =
- color: black
规范
| 规范 |
|---|
| CSS 嵌套模块 # cssnesteddeclarations |
浏览器兼容性
加载中…