javascript - Element.createShadowRoot() 的替代方案是什么？

Question

我正在使用这段代码:

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

我也是reading this .

如何解决？有什么替代方案？

Answer 1

现在您可以使用 attachShadow() 代替 createShadowRoot():

• 是implemented natively在 Chrome (53+)、Opera (40+)、Safari (10+) 和 Firefox (63+) 中。

• 还有一个polyfill 由 webcomponents.js 团队提供:ShadyDOM .

Shadow DOM v1 是一个 DOM Living Standard .

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