Shadow DOM让我们实现了什么?

Nar*_*sty 5 html5 web-component shadow-dom angular

我认为shadow DOM让我们实现了样式封装,并隐藏了组件的HTML实现.

但是当我在chrome中检查shadow root时,我可以看到组件的HTML. 在此输入图像描述

那究竟是什么帮助我们实现的呢?它只是风格封装吗?

Gün*_*uer 6

当然,DevTools允许你研究阴影DOM但是如果你得到index.html querySelector('body').innerHTML阴影的HTML 则不包括元素的DOM.

您明确需要切换到自定义元素的shadow DOM才能访问该HTML.

Shadow DOM不是要将你的元素实现隐藏起来,而是将其隐藏在CSS,JS或其他可能意外读取或操纵它的方法之外.

这允许将整个应用程序的DOM的复杂性分解为更易于管理的较小部分.