JS开发利器——chrome调试器使用浅析(一)

看到有些新入门的朋友在为了JS的调试而发愁。所以有了写这么一篇博客的动力，能帮助别人就好。我会慢慢修改，直到看着比较满意为止。

1. 要求： 对JavaScript基础有一定掌握，个人认为，在学习了JS基础1-3个月就可以了。

2. Chrome下载地址： 建议，在百度之中搜索关键字“Chrome 中文版”,然后随便选择一家下载站即可。目前比较好的是 新浪下载、pconline、还有天空。至于版本，下载最新版即可，再此不多说，版本帝更新换代太快了。

3. Chrome内置了调试器，不像Firefox一样，需要自己搜索下载FireBug插件。 我只能说，Firefox适合高手，我只是个菜鸟。

4. 言归正传，怎么进入调试器呢？ 最简单的方法： 打开一个网页，然后在页面之中的某处单击鼠标右键、在弹出的菜单之中选择“审查元素(N)”.即可进入调试器。但是此处进入的是HTML元素文档结构，这个暂时不讲。 不要捉急，在下方弹出框顶部的右边，有一个"Console"。这个就是控制台了。

5. 把光标移到控制台内部，试着输入 window ，也就是标准的JS全局对象，然后回车，看到什么了？下方输出了一行，点击左边的那个歪三角形，将会看到window的属性和方法。没错，这就是标准的调试信息了。

6. 如果你在html页面的JS里面输出 console.dir(window); 结果将会和刚才在控制台的输出是一模一样的。console 代表的是控制台对象，属于环境对象，在chrome和firefox下面存在。常用的方法有： console.info(xxx),和console.dir(xxx);没错，dir就表示列出对象的结构树。而info就是标准输出。

7. 既然可以再控制台得到对象信息，那么，还要console对象干什么呢？ 原因是，控制台只可以输出全局变量以及其子对象。也就是说，匿名对象和临时变量在控制台手工是查找不到的。所以，在代码内部，可以通过这两个方法来打印出调试信息。

8. 这种方法被称为 暴力调试。也就是暴力的系统输出。另外的是断点调试，暂时不讲。

9. 在控制台里面输入 console.dir(xxx)也是可以执行的，一般来说，句末没有分号无所谓。

10. 如果要输出多行的文本肿么办？ CTRL+ 回车试试，你会有惊喜的。

11. 今天暂时到这里吧，程序员找女朋友不容易，你们懂的。