Google Chrome 调试JS利器

我是一名忠实Chrome迷，使用它已经快有2年的历史了，整体给我的感觉就是清爽，快速，简洁。又打小广告了……^_^，虽然我知道IE8+也有调试工具，包括火狐的什么XXBUG，但是我用过之后，个人还是十分偏爱chrome的debug。

chrome对于在前端打拼的兄弟姐妹是十分有帮助的，它优雅的实时展示DOM，捕获N个ajax传递过来的参数

查看动态DOM

实时获取JSON数据

包括chrome中N多插件……

当然我在这里列举一个十分有用的javascript调试的技巧

首先请打开“谷歌浏览器”（废话），然后打开一个网页，按“F12”会出现一个控制台

找到一个叫做“Sources”,点击它

OK，如果你的页面现在已经加载过JS脚本的话，那么应该可以看到一些JS文件了

然后你可以在左侧侧栏的序号那些位置点击一下就设置成断点，当你要执行某个函数的时候浏览器就会自动进入调试模式了

细心的你肯定会发现Scope Variables区域显示的竟然就是Object对象的元素，大惊。起初我们要想展示一个对象要么采用

1 2 3 4 5

function forIn(o) {      for (i in o) {          document.write( '<strong>' + i + ' --></strong> ' + o[i] + '<br />' );      } }

你会发现页面很麻烦，而且也不是很灵活，现在学会chrome的debug工具我相信会给你带来莫大的帮助了。