如何查看页面的HTML层次结构

Question

我正在寻找一个工具来标记页面上的组件及其在DOM中的位置，因此我可以立即看到，特定div是其他div的子项并且有一些子div。我知道我已经看过这个工具但是很久以前我不记得它来自哪里了。 Chrome开发工具？

Answer 1

我认为您指的是Chrome的检查员。只需右键单击页面上的任何DOM元素，然后单击＆＃34; Inspect element＆＃34;

从那里你可以看到HTML的层次结构

https://developers.google.com/web/tools/chrome-devtools/inspect-styles/了解更多信息

Answer 2

选择元素后，此面包屑会显示当前所选元素的所有父元素。