Web组件是热门的新事物,也是一个真正的Web标准,每个人都在谈论它们并且可能使用它们,它们似乎是我们遇到的问题的完美解决方案(在不同的站点之间共享组件).
所以我们构建了几个Web组件.Chrome中的工作正常,但IE11中没有.使用polyfill可能吗？https://www.webcomponents.org/polyfills有大量的polyfills,但IE11一直在抱怨class.
也许编译成ES5？各种来源声称Web组件需要ES6,因为您在IE11中没有从HTMLElement获得相同类型的继承.有自定义元素-es5-adapter.js,但不知何故它不起作用.如果我编译下来,webcomponents不起作用.如果我不这样做,IE11就会失败class.
但是每个人都在使用网络组件.你怎么做呢？你根本不支持IE11/Edge吗？难道我做错了什么？
我读过的所有内容都表明Shadow Dom从其父页面CSS开始是“安全的”。IE浏览器，如果我将所有div样式设置为紫色字体：
<style>
div{color: purple}
</style>
我的Shadow Dom中的div应该具有浏览器的默认颜色。
我正在写一个chrome扩展名，它将html注入任何给定的页面。除非此html受Shadow Dom或Iframe保护，否则它将继承所有页面的CSS。
建议解决这个问题，这个问题，是使用暗影大教堂。因此，我实现了一个解决方案，但注意到它仍在继承页面的CSS。我以为这可能是在Chrome扩展程序中使用它时遇到的一个问题，所以我从一些Shadow Dom示例中劫持了jsBin（并把它扔到了另一个在线编码应用中以作很好的衡量）。
https://codepen.io/hyrumwhite/pen/xPRexQ
结果相同。我的影子DOM继承了页面CSS，我的div（奇怪的是我的h1）是紫色的。
似乎Shadow Dom中的子代将继承应用于host元素的任何样式。
这是按设计工作的吗？有办法防止这种情况吗？还是影子DOM足够新，以至于这是一个bug，我应该期待使用它时会遇到类似的bug？