---
title: Element.createShadowRoot()
slug: Web/API/Element/createShadowRoot
translation_of: Web/API/Element/createShadowRoot
---
<p>使用<code>Element.createShadowRoot</code> 创建的实例 <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">阴影DOM</a>。创建shadow DOM时，它始终附加到现有元素。创建shadow DOM之后，它所附加的元素称为{{glossary("shadow root")}}。</p>

<div class="note">
<p>不推荐使用此方法，而使用{{DOMxRef("Element.attachShadow()","attachShadow()")}}。</p>
</div>

<h2 id="Syntax" name="Syntax">句法</h2>

<pre class="syntaxbox">var <em>shadowroot = </em><em>element</em>.createShadowRoot();
</pre>

<h3 id="参数">参数</h3>

<p>没有参数。</p>

<h3 id="结果值">结果值</h3>

<p>返回{{DOMxRef("ShadowRoot")}}。</p>

<h2 id="产品规格">产品规格</h2>

<p>任何规格都不再定义此功能。</p>

<h2 id="浏览器兼容性">浏览器兼容性</h2>

<div class="hidden">此页面上的兼容性表是根据结构化数据生成的。如果您想为数据做出贡献，请查看<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>并向我们​​发送拉取请求。</div>