javascript调试

最近看到很多新同志调试JS的时候用的是我曾经的方法alert()。这虽然也是种调试方法，但是麻烦，要在页面上一个一个的加alert()，调试完后又要去删除。所以这篇文章是给新同志用的，虽然我现在了也是个小鸟，但我也想分享一些自己曾经苦恼过的问题，然后总结一些经验，让各位新鸟不要再出现我曾经有过的苦恼。下面是一些比较简单常用的，还有一些其它比较高级的，大家看完后可以自己研究一下。看的起我这个小鸟的话，也可以和我交流一下。哈哈哈哈哈，下面开始进入正题吧。

 

javascript调试，大家一般都是用alert来，以前我没有用google,firefox的时候，也是这样来调试的，后来发现firefox的firebug和google可以调试javascript，可以像Eclipse,VS一样设置断点，这样调试javascript确实方便多了。下面来给大家分享一下，怎么用google来调试javascript。

第一步，打开（快捷键是F12）

 

第二步，切换到sources选项，找到你要调试的文件（多个文件点击左边那个小三角，选择你要调试的文件）

 

 

第三步，找到你要调试的语句，点击最左边，当出现一个蓝色的点的时候，说明断点设置成功。然后刷新页面，程序就开始调试了，到了断点外，程序会挂起。

你也可以在你要调试的语句前面，点击右键，选择Add breakpoint，添加一个断点。下面步骤同上。

 

 

调试基本操作说明，有跳转到下一个断点，单步执行，进入等等（如果大家看不清楚，可以在一个新页面中打开这张图片看） 

操作一：当遇到非内置方法时，点击右边中间那个按钮，是进入方法内部，快捷键是F11（我一直没有用成功过，可能和浏览器全屏的快捷键冲突了）

 

操作二：单步执行的效果，单步执行的时候，当遇到一个方法的时候，不会进入该方法的内部实现中，快捷键（F10）

 

 

操作三：当有设置多个断点的时候，可以点击，右边栏的最左边那个小三角，它会从当前位置跳到下一个断点

 

大家还可以看右边栏的一些其它选项，里面有一些变量的信息，等等。

 

辛苦大家了，我的文采不是很好，不知道大家能没有看到些对自己有些的东西。firefox，google浏览器还有一个console对象，这个对象也很有用，大家可以用console.log()打印一些变量，运行的时候将选项卡切换到Console就可以看到了。

 

转载于:https://www.cnblogs.com/CodePorter/archive/2013/01/22/2871337.html