1、打开 Chrome DevTool：（1犬匮渝扮）按 "F12"；（2）在 Chrome浏览器的右上角，点击最右侧的图标，在菜单选择“更多工具”-> “开发者工具”。
2、我们可以调整 Chrome DevTool的位置，例如：可以选择 DevTool在浏览器的底部，左侧，右侧或者悬浮。
3、点击 Chrome DevTool工具栏上最左侧的图标，将鼠标移动到要定位的页面元素，点击相应元素即可查看该元素的 DOM 信息。
4、在页面元素，点击鼠标右键，在菜单中选择“检查”，可查看该元素的 DOM信息。
5、按下快捷键“CTRL + F”，在搜索对话框输入相应信息，可查看对应的 DOM 信息。
6、在查看 DOM信息时，点击左侧的“...”符号，在弹出菜单，选择 expand recursively，展开 DOM信息。
7、总结：Chrome DevTool 可以让我们轻松方便地查看页面的DOM节点信息，是前端工程师必不可必的开发利器。