内容简介：Shadow DOM用官方的翻译来说就是影子 DOM，他能够为Web组件中的 DOM和 CSS提供了封装，实际上是在浏览器渲染文档的时候会给指定的DOM结构插入编写好的DOM元素，但是插入的Shadow DOM 会与主文档的DOM保持分离，也就是说Shadow DOM不存在于主DOM树上。Shadow DOM 需要append某一个DOM元素上，但是Shadow DOM封装出来的DOM元素是独立的，外部的配置不会影响到内部，内部的配置也不会影响外部。但是我们还是能够通过js或者css来控制Shadow DO
1、Shadow DOM的概念
Shadow DOM用官方的翻译来说就是影子 DOM，他能够为Web组件中的 DOM和 CSS提供了封装，实际上是在浏览器渲染文档的时候会给指定的DOM结构插入编写好的DOM元素，但是插入的Shadow DOM 会与主文档的DOM保持分离，也就是说Shadow DOM不存在于主DOM树上。
Shadow DOM 需要append某一个DOM元素上，但是Shadow DOM封装出来的DOM元素是独立的，外部的配置不会影响到内部，内部的配置也不会影响外部。但是我们还是能够通过js或者css来控制Shadow DOM里面封装好的元素。
在我们勾选了控制台的show user agent shadow DOM后，我们看video标签的时候会发现平时隐藏看不见的元素。
2、Shadow DOM的作用
上文讲过 ，Shadow DOM 是游离在 DOM 树之外的节点树，因此其拥有优秀的密封性。
也就是说，我们在开发组件的时候，可以利用浏览器为我们提供的这一个强大的封装功能去隐藏一些实现细节。开发者在使用我们开发组件的时候一目了然，不需要他关心的细节我们可以通过Shadow DOM隐藏掉，只给开发者暴露他们需要的接口便可。
3、Shadow DOM的创建方法
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持 码农网
猜你喜欢:
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
人类思维如何与互联网共同进化
[美] 约翰·布罗克曼 / 付晓光 / 浙江人民出版社 / 2017-3 / 79.90元
➢人类是否因互联网的诞生进入了公平竞争的场域？ “黑天鹅事件”频频发生，我们的预测能力是否正在退化？ 智人的第四阶段有哪些特征？ 全球脑会使人类成为“超级英雄”吗？ 虚拟现实技术会不会灭绝人类的真实体验？ 还有更多不可预知答案的问题，你将在本书中找到属于自己的答案！ ➢ 我们的心智正和互联网发生着永无止境的共振，人类思维会因此产生怎样的进化效应？本书编者约翰•布......一起来看看 《人类思维如何与互联网共同进化》 这本书的介绍吧!
