Questions tagged «web-component»

在我的项目中实现Shadow DOM是否会像React所使用的虚拟DOM一样使它们更快？

86 dom  web-component  shadow-dom  virtual-dom 

对于Google而言，这是不可能的，因为每个谈论:before和:after伪元素的文章似乎都使用“内容”一词。 我在这篇CSS-Tricks文章中听说了这一点，解释了如何实现图像滑块作为Web组件的示例用例。因此，它出现在内部的代码示例为： 的CSS #slides ::content img { width: 25%; float: left; } 的HTML <template> ... <div class="inner"> <content select="img"></content> </div> </template> 似乎是指该<content>标签，该标签用于允许用户包括Web组件，但我希望对此有更深入的了解。 编辑： 在进一步阅读之后，在上述文章中，我找到了作者的“ Shadow DOM CSS Cheatsheet”链接，其中包括一段解释什么是::content伪元素的段落： 选择元素内部的分布式节点。对于不支持本机选择器的浏览器，需要与polyfill-next-selector配对。 ::content h1 { color: red; } 资料来源：http : //robdodson.me/blog/2014/04/10/shadow-dom-css-cheat-sheet/ 这是有帮助的，但是我仍然发现整个事件相当不透明。还有其他见解吗？

74 html  css  css-selectors  web-component  shadow-dom 

在查看Polymer时，我在Chrome 37开发人员工具的“样式”标签中看到以下CSS选择器： 我也看到了带有伪选择器的选择器::shadow。 那么，是什么做的/deep/和::shadowCSS选择意味着什么？

71 css  html  polymer  web-component  shadow-dom 

我需要建立一个应该需要工作与两个规格，组件custom elements spec v0它得到了过时和custom elements spec v1，最新的稳定版本。 如果我使用custom elements v0规范构建组件，则由于某些应用正在使用polymer 2和使用上述规范，因此它们将面临问题，而polymer 1与custom elements v1规范不兼容的应用将面临同样的问题。 我无法控制更改Polyfill的应用程序，某些应用程序必须使用支持旧规范的Polyfill，而某些应用程序使用新的Polyfill。 我正在寻找一个可靠的解决方案，以结合这两个规范以在所有应用程序中运行我的自定义元素，而不管polyfills版本如何。我可以在组件中添加任何polyfill或代码段，以便它们可以在任何地方运行，但我还没有找到支持我的两个规范的库或polyfill。 我打算编写一个适配器，该适配器可以结合下面提到的用于绑定回调的映射之类的两个规范，对此的意见将不胜感激。 connectedCallback(){ this.attachedCallback(); } 我尝试使用stenciljs，但它只能与最新版本的自定义元素规范一起使用。我还没有找到任何方法来对其进行调整以使其与早期规范兼容。 请针对上述情况提出一些可行的替代方案和可行的解决方案。

9 javascript  html  web-component  polyfills  custom-element