CSSScopeRule

可用性有限

此功能不是基线功能，因为它在一些最广泛使用的浏览器中不起作用。

CSSScopeRule 接口是 CSS 对象模型 的一部分，它表示 CSS 的 @scope 规则。

CSSRule CSSGroupingRule CSSScopeRule

实例属性

继承其祖先 CSSGroupingRule 和 CSSRule 的属性。

结束

返回一个字符串，其中包含 @scope 规则的范围限制的值。

开始

返回一个字符串，其中包含 @scope 规则的范围根的值。

实例方法

继承其祖先 CSSGroupingRule 和 CSSRule 的方法。

示例

在 JavaScript 中访问 @scope 信息

假设以下是附加到文档的唯一样式表

css
@scope (.outer) to (.inner) {
  :scope {
    background: yellow;
  }
}

以下 JavaScript 可用于访问有关包含的 @scope 块的信息

js
const scopeBlock = document.styleSheets[0].cssRules[0];

console.log(scopeBlock.start); // Returns ".outer"
console.log(scopeBlock.end); // Returns ".inner"

规范

规范
CSS 级联和继承级别 6
# cssscoperule

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅