Web Components #6 组件样式css
自定义组件样式web组件的css注意项.主要是 Shadow DOM的样式,和module中加载css. css in js.
分类 前端 下的文章
Web Components #5 - 组件生命周期
组件的生命周期constructor: 组件初始化时,被调用connectedCallback: 当 组件 首次被插入文档 DOM 时，被调用。disconnectedCallback:当 组件 从文档 DOM 中删除时，被调用。adoptedCallback:当 组件 被移动到新的文档时，被调用。attributeChangedCallback: 当 组件 增加、删除、修改自身属性时，被调用。
例有如下组件:
Web Component #4 - template模板和Slot插槽
Slotslot插槽,占位. 参考vue
Web Component #3 - Shadow DOM（影子 DOM)
什么是Shadow DOM?Shadow DOM（影子 DOM）,类似
iframe 一个独立DOM容器,可以封装子元素,里面的样式与全局样式不会相互污染. 与iframe不同的是共用一个windows空间. JS事件又能互通的.ShadowDOM是WebCompnent组件重要的一部分. Web Component #2 - 自定义元素
什么是Custom Elements？Custom Elements是Web Components的一部分，它允许开发者定义自己的HTML元素，扩展了标准的HTML元素集合。你可以为这些自定义元素定义自己的行为、样式和功能，就像你在使用原生HTML元素（如
<div>、<p>、<input>等）一样。