Javascript Element.createShadowRoot（）的替代方案是什么？

我正在使用这段代码：

function setShadowDOM(i, css){
    [].forEach.call(document.getElementsByTagName(i), function(hostVal) {
        var _root = hostVal.createShadowRoot();
            _root.innerHTML = '<style>:host ' + css + '</style><content></content>';
    })
}

函数setShadowDOM（i，css）{
[]forEach.call（document.getElementsByTagName（i），函数（hostVal）{
var_root=hostVal.createShadowRoot（）；
_root.innerHTML='：主机'+css+''；
})
}

我也是

如何解决这个问题？替代方案是什么？

告诉您使用。。。但该功能本身被标记为非标准，目前任何浏览器都完全不支持该功能：

除非有一个标准能够提供良好的浏览器支持，否则如果您想使用web组件，最好使用（作为浏览器）或（有自己的API）

由于甚至不支持

attachShadow

，您目前的选择是：

• 在不受支持的浏览器中继续使用并使用此功能

。。。或：

• 将web组件移植到（这意味着您应该使用Polymer的API）

---

许多人喜欢这样做，正是因为它有自己的API。如果您使用，您的代码更有可能是未来的证明，因为确切的web组件实现是在幕后进行的，对该实现的任何更改都不太可能影响Polymer自己的API。

现在您可以使用

attachShadow（）

而不是

createShadowRoot（）

：

• 它在Chrome（53+）、Opera（40+）、Safari（10+）和Firefox（63+）中使用

• webcomponents.js团队还提供了一个a：

阴影domv1是一个

---

Edge将很快采用Chromium引擎，然后它将与Shadow DOM v1兼容。

来自

mdn

：

此方法已被弃用，取而代之的是attachShadow。

，此问题将有助于：