Elements:
左栏以DOM树形式查看网页源代码(HTML),点击可依次展开各个节点查看具体代码,比如测试中发现有些数据没有显示在网页上,这时点开对应节点看一下,入参是否正常传入是很有用的。
并且在选中节点时会在网页上实时显示选中的节点(以色块标注),这是调试网页时最常用的功能。右键可编辑所选节点的代码。
右栏实时显示所选节点相匹配的CSS属性。修改CSS属性可在网页实时显示样式的改动,这也是最常用的功能之一,比如我们可以修改一个搜索栏的背景颜色。
Network:
以瀑布流形式列出该网页所引用的图片,音频,视频等文件,当想下载东西而网页禁止的时候,可以打开这里来找源代码,有个小窍门就是time最长的就是视频(我都了解的啥乱七八糟的==)
Sources: