JavaScript调试方法

调试时开发项目中必不可少的一项技能，掌握好调试方法会让你的开发事半功倍，更有效率！

1、alert()

起初阶段，JavaScript的调试主要是alert()，目前仍然具有一定的地位

2、console

console会在控制台打印出调试信息，不直接影响页面的显示，经常使用的是console.log()、console.error()等

调试完后尽量把与业务逻辑无关的调试代码删除！！！

3、断点调试

类似于Java的断点调试，需要打开开发者工具，一般的浏览器是F12

（1）Sources菜单

在Sources菜单下，找到源文件，直接在文件的行号处添加断点

（2）debugger断点

在代码中添加debugger;语句，代码执行到该语句时自动断点，其他和Sources菜单操作一样

（3）DOM断点

通过开发者工具面板的Elements菜单，快速定位DOM节点，再通过DOM节点定位脚本

当节点内部子节点变化时断点（Break on subtree modifications）

当节点属性发生变化时断点（Break on attributes modifications）

当节点被移除时断点（Break on node removal）

（4）XHR断点

XHR断点调试正是为异步（Ajax，XMLHttpRequest）调试而产生的断点调试功能

通过"XHR Breakpoints"右侧的“+”给异步断点添加断点的条件，当异步请求的URL满足此条件时，自动产生断点

只对原生的Ajax起作用，对于封装好的Ajax没用，因此在实际开发中很少使用该方法调试

（5）事件监听器断点

根据事件名称进行断点设置，当事件被触发时，定位到事件绑定的位置

总结：调试方法在开发过程中的重要性不用多说，选择一种适合自己的调试方法对于开发至关重要，这需要不断尝试，不断积累经验

具体请参考文章：http://www.codeceo.com/article/javascript-debug-skills.html