--- title: ShadowRoot.mode slug: Web/API/ShadowRoot/mode translation_of: Web/API/ShadowRoot/mode --- <div>{{APIRef("Shadow DOM")}}{{SeeCompatTable}}</div> <p><strong><code>mode</code></strong> 是 {{domxref("ShadowRoot")}} 的只读属性,它返回 <code>ShadowRoot</code> 创建时的模式 ("<code>open</code>" 或者 "<code>closed</code>") 。</p> <p>当 <code>ShadowRoot</code> 的 <code>mode</code> 是 "<code>closed</code>" 时, <code>ShadowRoot</code> 的内部实现无法被 JavaScript 访问及修改 — 也就是说将该实现不公开,例如,<a href="https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/video" title="HTML <video> 元素 用于在HTML或者XHTML文档中嵌入视频内容。"><code><video></code></a> 标签内部实现无法被 JavaScript 访问及修改。</p> <h2 id="Syntax">Syntax</h2> <pre class="syntaxbox">var <em>mode</em> = <em>shadowRoot</em>.mode</pre> <h3 id="Value">Value</h3> <p>值为 "<code>open</code>" 或者 "<code>closed</code>".</p> <h2 id="Specifications">Specifications</h2> <table class="standard-table"> <tbody> <tr> <th scope="col">Specification</th> <th scope="col">Status</th> <th scope="col">Comment</th> </tr> <tr> <td>{{SpecName('DOM WHATWG','#dom-shadowroot-mode','ShadowRoot.mode')}}</td> <td>{{Spec2('DOM WHATWG')}}</td> <td> </td> </tr> </tbody> </table> <h2 id="Browser_compatibility">Browser compatibility</h2> <p>{{CompatibilityTable}}</p> <div id="compat-desktop"> <table class="compat-table"> <tbody> <tr> <th>Feature</th> <th>Chrome</th> <th>Edge</th> <th>Firefox (Gecko)</th> <th>Internet Explorer</th> <th>Opera</th> <th>Safari (WebKit)</th> </tr> <tr> <td>Basic support</td> <td>53</td> <td>{{CompatNo}}<sup>[1]</sup></td> <td>{{CompatNo}}<sup>[2]</sup></td> <td>{{CompatNo}}</td> <td>40</td> <td>10</td> </tr> </tbody> </table> </div> <div id="compat-mobile"> <table class="compat-table"> <tbody> <tr> <th>Feature</th> <th>Android</th> <th>Edge</th> <th>Firefox Mobile (Gecko)</th> <th>IE Phone</th> <th>Opera Mobile</th> <th>Safari Mobile</th> </tr> <tr> <td>Basic support</td> <td>53</td> <td>{{CompatNo}}<sup>[1]</sup></td> <td>{{CompatNo}}<sup>[2]</sup></td> <td>{{CompatNo}}</td> <td>40</td> <td>10.1</td> </tr> </tbody> </table> </div> <p>[1] This feature is not implemented yet. See the <a href="https://developer.microsoft.com/en-us/microsoft-edge/platform/status/shadowdom/">Edge platform status</a>.</p> <p>[2] This feature is not implemented yet. See {{bug(1205323)}}.</p>