html页面和Chrome开发者工具elements界面不一致的一个可能原因

一个例子:

虽然UI上input field里显示的是Jerry,但是Chrome开发者工具里面并没有显示出来。

html页面和Chrome开发者工具elements界面不一致的一个可能原因

注意上图最下方,显示的input后面有#shadow-root.div.

打开settings elements区域的"Show user agent shadow DOM"即可:

html页面和Chrome开发者工具elements界面不一致的一个可能原因

现在能够在Chrome开发者工具里看到这个shadow DOM了:

html页面和Chrome开发者工具elements界面不一致的一个可能原因

要获取更多Jerry的原创文章,请关注公众号"汪子熙":
html页面和Chrome开发者工具elements界面不一致的一个可能原因