Java Web项目 JavaScript debug调试方法

Java Web项目 JavaScript debug调试方法

 

背景

诸如IDEA和Eclipse等IDE都可以debug调试Java代码，那么问题来了，页面的JavaScript如何调试呢。在实际开发工作中，我们肯定需要来debug JavaScript代码，直接在IDE（我这里用的是IDEA）的JavaScript代码打断点是没有效果的，那要怎么debug呢，这时候就需要Google chorme浏览器的debuger了（火狐浏览器也可以，当然是其中一种方法，不知道还有没有其他方法，有更好的方法的话，麻烦告诉下）。好了，下面就记录下怎么使用 Google 浏览器的JavaScript debug功能。

设置断点及使用

1）打开浏览器的开发者工具，如下图：或者直接按F12键可以直接打开

2）点击“Sources” —》选择你要debug的JavaScript文件，鼠标左键点击图片3的区域设置/取消断点；

3）debuger工具栏：

工具栏：

(1) 跳到下一断点，快捷键F8

(2)下一步： F10


(3) F11

(4) Shift+F11