学习笔记——谷歌浏览器之开发者工具(1)

学习笔记——谷歌浏览器之开发者工具(1)_第1张图片
开发者工具,窗口几种停靠的模式

学习笔记——谷歌浏览器之开发者工具(1)_第2张图片
数据抓包,保持日志,防止跳转时抓包数据被刷新掉。

学习笔记——谷歌浏览器之开发者工具(1)_第3张图片
右击勾选,显示数据交互模式

学习笔记——谷歌浏览器之开发者工具(1)_第4张图片
开启JS搜索

学习笔记——谷歌浏览器之开发者工具(1)_第5张图片
搜索JS、大小写区别、正则

学习笔记——谷歌浏览器之开发者工具(1)_第6张图片
点击左边行数可下断点,JS每行结束为;分号。

学习笔记——谷歌浏览器之开发者工具(1)_第7张图片
下断点后,选中部分完整的语句,会显示出该语句的计算结果。

学习笔记——谷歌浏览器之开发者工具(1)_第8张图片
选择函数会出现该函数在哪个JS文件第几行,以前具体的函数名称。点击跳转至该JS页面中函数的位置。

学习笔记——谷歌浏览器之开发者工具(1)_第9张图片
自建调用函数,需要有一个返回值,return。双击上面函数名,可在下面填入参数后,点击运行。计算返回的结果。

学习笔记——谷歌浏览器之开发者工具(1)_第10张图片
跳到下一个断点;执行下一条语句;进入到函数中;跳出函数;禁用/启用断点。
LOCAL:局部变量
Global:全局变量或全局函数
Breakpoints:当前所有下的断点,右击可删除断点。

学习笔记——谷歌浏览器之开发者工具(1)_第11张图片
需要加入调用函数function;双击函数名,输入参数值,可以进行计算返回的结果。

你可能感兴趣的:(学习笔记)