影子dom的伟大和陷阱是封装的风格，这让我想到了如何实现列表元素的样式。
假设您有2个自定义元素，一个列表和一个列表项：
选项一
将阴影dom附加到列表项并实现您的样式，这样可以正常工作，并且您可以在html中创建标记....但是，请说出于某些奇怪的原因，样式达到1MB并且您有1000个项目那个列表，浏览器是否只为这些元素使用1GB，因为每个元素都包含它自己的样式？其次，如果列表对列表项的布局进行约束（如“密集项”），可能会失败：主机（[密集]）并且你可以亲吻所有的frawework再见（bootstrap md），但那就是移动逻辑到了错误的地方。我真正的问题是，影子dom中所有重复的样式会发生什么。
选项二
您可以将阴影dom放在列表中，并使用light dom制作元素，这更有意义，因为样式仅应用于容器，容器限制内部元素。解决方案2的问题是开槽元素实际上并不在元素的dom内，因此需要忍者猴编码来将元素从开槽节点移动到阴影节点......这有效，但仍然是粗略的。
选项三 几乎像选项2，但继电器通过JSON填充项目（解析innerHTML脚本标记和/或包含列表模板标记），但是你放弃了所有语义，这可能是一个问题，如SEO没有索引主菜单，但是可以通过xhr轻松管理组件。
首选方式是什么？