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 |
瀏覽器相容性
載入中…