Js逆向教程-03浏览器调试工具-Source面板
切换到source面板，对于source面板，需要打开搜索面板才能发挥出完整的功能。
一、搜索面板
通过点击右上角的按钮，切换到搜索面板
搜索页面的左侧，可以给搜索页面添加其他功能
比如console控制台功能，Network request blocking功能
二、Page面板
它包含当前百度页面请求的所有资源文件，都位于page中，平常用的不多。
三、Filesystem面板
本地文件系统，可以添加一个本地的workspace，记得要允许访问权限
四、Overrides(重写面板)
它的作用时对当前网站上已有的js文件进行替换改写，然后放置到网站上看下替换改写后的效果，它也会请求权限，记得点允许。
可以在network面板中找到一个js文件，右键=》Open in source pannel ，然后，就可以编辑这个js文件了，比如说可以添加一个dubugger，保存后，你会发现
Overrides面板中会有一个js文件保存到本地文件夹中,。
五、Content scripts面板
这里存放的当前上下文的js文件，上下文的概念后面会讲。
六、Snippets面板
它用于在网站上创建工作js记录。
比如说你想实现一个功能，但是你不想放到本地文件中去保存，就可以在这里写js文件，在这里写的js代码可以影响到整个网站页面的。
比如说想要修改百度一下的文本：
就可以在面板中输入：
var aaa = document.querySelector("#su");将文本获取到。
让后通过
aaa.value = ""将百度一下设置为空。
七、调试代码面板
找到一个js文件，在左侧位置，添加断点，添加后，刷网页，就会在断点停住，此时，可以通过如下按钮进行代码调试：
按钮的含义如下：
7…1Paused on breakpoint
在捕获到异常代码时中断停止。抛异常,，会自动在这里停下
try
{
//抛异常,，会自动在这里停下
}
catch
{
}7.2断点属性设置
右键断点，会弹出如下菜单：
Edit breakpoint
编辑断点条件，当为true,当前断点生效，如果为 false ，跳过当前这一行所有断点。
7.3Watch
可以将一个变量添加到监听列表，将变量的数据都展现出来
。比较方便的查看变量数据，而不是在console面板中，每次都输出。
7.4Call Stack
调试堆栈比较重要，后面会对应讲解。
7.5Scope
作用域
- Local局部作用域
- Global全局作用域
7.6 XHR/DOM断点列表
7.7 全局监听事件
7.8 事件监听断点
八、Console面板
用于控制台用于交互操作数据。
- Hide network:是否隐藏network，能看到的数据包越多越好，不用隐藏
- Preserve log保留数据包 勾选上方便调试
- selected context only:选择当前上下文，可以不用勾选
- Group similar 分组
- Log XMLHttpRequests 是否输出xml请求
九、总结
最后的最后
由本人水平所限，难免有错误以及不足之处， 屏幕前的靓仔靓女们 如有发现，恳请指出！
最后，谢谢你看到这里，谢谢你认真对待我的努力，希望这篇博客对你有所帮助！
你轻轻地点了个赞，那将在我的心里世界增添一颗明亮而耀眼的星！
