本文已参与「新人创作礼」活动，一起开启掘金创作之路。
需求：随便一个网页，点击任意一处，精确找出源码中网络请求的代码位置。 可能网页在不断地刷新数据，而且很快，还有浏览器插件、广告等影响。
1. 格式化js代码
2. 开启BlackBoxing
原因： 屏蔽掉页面涉及到的不关心的js文件访问网络，如广告库，第三方js库等
做法： 需开启BlackBoxing功能
操作： F12 => F1 => Blackboxing ，选中复选框，如下图：
还没完，需要添加规则。可以写正则表达式，不过也有简单方式，即在Sources中打开的js文件，格式化js文件，之后在行号处右键，选择Stop blackboxing，如下图：
，这时你可以看到这样的变化
3. 强大的Source面板
DOM节点变化监听的断点
网络请求数据查看、断点添加
4. 格式化Json数据
console中，输入 copy(要格式化的json数据)，然后按回车，此时格式化后的Json数据已经复制到了剪贴板，你粘贴下试试，还有一份打印了出来。
5. Network，找出我的点击请求
6. 快捷键
Ctrl + Shift + F ： 选中Sources -> Page 中的最顶端的文件夹，按该快捷键，可以在源文件中搜寻指定规则的字符串所属文件 Ctrl + Shift： 配合上一个快捷键，可以在指定文件中搜索用处 Ctrl + P： 快速定位文件 Ctrl + Shift + O： 快速定位函数 Ctrl + G： 快速定位到文件某行
7. Snippets （JS编辑器，Sources下）
8. debugger
源文件中加入debugger则调试时运行到此停下
9. 调试按钮
- 到下一个断点或停止
- 下一步（不进入函数）
- 下一步（有函数则进入）
- 跳出函数
- 一步
- 断点开关，灰色为断点起作用，蓝色为断点不可用
- 遇到异常代码是否中断开关
