作为开发Web相关人员，有必要了解这个开发工具，会提供给你不少的帮助，进入正题。经典的F12启动，这个大家都知道。

 

一 控制台可以很好的帮我们掌控错误，包括文件的加载、JS语法、CSS语法、安全问题。

点击选中即可显示，否则隐藏，当然很多许多错误，需要打开控制台重新刷新加载才能看到，比较常见的网络工具需要重新加载才能看见。

这里提供一个过滤工具，比如我们查找文件加载异常的404错误。

二 查看器

查看器可以编辑复制粘贴HTML，但是查找的时候只能查找HTML元素非任意字符。

右侧的工具不说了，大家都懂。

 

三 调试器JS，不做深入探讨，毕竟调试和测试针对小程序来讲几乎不必要，这里也可以搜索，但是功能比较弱，希望能够提供脚本编辑功能。

 

四 样式编辑功能

我们可以新建、导入、编辑样式、在线调试，免去每次都要保存刷新的烦恼。

这个最新版本支持CSS提示功能，可盼来了。

 

五 着色编辑器

这个不懂，略过。

 

六 分析器

如果你有强迫症可以试试

 

七 网络还是比较实在的

查看所有请求的方法，资源情况，域名，右侧提供更详细的功能，可以自行挖掘，比较有意思。

右下侧有个性能分析的工具，也是最近更新的，点击后，有高要求的人可以试试，比较形象直观。

 

八 工具栏小助手

点击设置，

这些都是基础功能，更多的需要个人平时使用探索。