chrome devtool 技巧 之 开篇

[spacewander]

作为一个chrome用户 && 写前端的程式设计师， chrome开发者工具（chrome devtool）基本上几乎是每天都用到。

虽然之前已经掌握了devtool的基本用法，比如查看元素和设置js断点，在console中测试js代码之类。不过这些只是一些基本的技巧，只是devtool中常用的20%功能，还有80%的高级功能没有用到呢。而且，自身也没有系统去学习。

所以现在就打算挤出几天时间，把官方的文档浏览一遍，系统地学习下devtool的使用技巧。

这里是第一篇，开篇，陈述了我写下这个系列的由头，还有一些不适合放在独立的篇章的内容，比如下面的一些快捷键：

一些快捷键

<C-F> : 在所有的文件中搜索 <C-o> : 快速打开某个文件

推荐一篇必看的文章

https://developer.chrome.com/devtools/docs/authoring-development-workflow

虽然未能覆盖devtool许多功能，而且某些我觉得重要的功能这里也没提，这篇文章还是相当值得一读。它覆盖了许多devtool使用中的要点。