使用chrome调试工具解决问题（四）

在chrome中断点调试

下面是谷歌官网关于断点调试的示例，页面上写两个数，然后两个数相加求和，结果有问题，通过断点的方式来查找解决问题

源代码(Sources)选项卡

1：表示我们整个页面所加载出来的资源，包括jS，包括CSS，包括页面，包括图片，全在这里边；top表示我们整个页面，整个页面下它加载了一些资源；googlechrome.github.io表示资源所在的域，域下边是资源的文件结构。

2：显示这个资源的内容。

3：展示的是断点信息

4：当代码运行到断点位置的时候，展示它目前所能使用的所有的局部变量以及全局变量，以及壁包产生的东西。

开始调试

根据观察我们发会发现，这个错误是我点击了这个按钮之后产生的

按如上图1~4步定位到按钮的点击事件。

在这个函数第一句代码打上一个断点，再点击求和按钮，程序会停在第一句话。

上面这个按钮表示：执行完这一行代码，把这一行代码全部执行完，跳到下一行代码；

上面这个按钮表示：一步步看每行代码详细执行过程；

上面这个按钮表示：把这个函数立即执行完，回到上层调用；

上面这个按钮表示：恢复运行，直到遇到下一个断点，如果说没有遇到断点，那就运行结束。