ShadowRoot: mode 属性
ShadowRoot 的 mode 只读属性指定了它的模式——open 或 closed。这定义了该 shadow root 的内部特性是否可以从 JavaScript 访问。
当 shadow root 的 mode 为 "closed" 时，shadow root 的实现细节对于 JavaScript 是不可访问且不可更改的——这与例如 <video> 元素的实现细节对于 JavaScript 不可访问且不可更改的方式相同。
该属性值是使用传递给 Element.attachShadow() 方法的对象的 mode 属性设置的，或者在使用声明方式创建 shadow root 时，使用 <template> 元素的 shadowrootmode 属性设置的。
值
一个字符串值，可以取以下值之一：
示例
js
// We create a closed shadow root, that is not accessible
let element = document.createElement("div");
element.attachShadow({ mode: "closed" });
console.log(element.shadowRoot); // logs null as the shadow root is closed
// We create an open shadow root, that is accessible
let element2 = document.createElement("div");
element2.attachShadow({ mode: "open" });
console.log(`The shadow is ${element2.shadowRoot.mode}`); // logs "The shadow is open"
element2.shadowRoot.textContent = "Opened shadow"; // The shadow is open, we can access it from outside
规范
| 规范 |
|---|
| DOM # dom-shadowroot-mode |
浏览器兼容性
加载中…