谷歌浏览器进行Debug断点调试 ；

一：【基础知识】：调试按钮

1. F12开发者模式 ：调式按钮图；

2.按钮的快捷键 及 作用；

项目	Value
F8 或者 (Ctrl + \ )	Pase script execution 暂停/继续【对应上图第1条】
F10 或者 ( Ctrl + ’ )	Step over next function 单步执行 【对应上图第2条】
F11 或者 （Ctrl + ；）	Step into next function 单步进入 【对应上图第3条】
Shift + F11 或者 (Ctrl + Shift+ ； )	Step out of current function 单步退出 【对应上图第4条】
Ctrl +Shift+E	被选中代码在控制台中打印出console信息
Ctrl + Shift + A	添加到debugger的watch里面,可以关注你选中内容的变化
Ctrl + B	打断点/取消断点(很实用)

二：定位页面DOM绑定的事件js代码；

1. 开发者界面: Sources 窗口下；

打开开发者界面:Sources 窗口
观察箭头：
1.右侧：Event Listener Breakpoints 栏；
2.选择：click选项（监听点击事件）；

效果：再次点击页面时： 会自动进入断点模式；且定位与点击位置相关的JS

展开Call Stack（函数调用栈）；
F11 观察Call Stack ；
寻找事件是直接事件源；

2. 开发者界面: Element 窗口下；

打开开发者界面:Sources 窗口;