做前端开发应该都了解浏览器，这里主要介绍Chrome全文参考chrome-developer-tools javascript-debugging。如果有Eclipse Debug的经验应该很好理解。Chrome Debugger还可以用于调试nodejs应用这个以后写文章介绍
基础调试
-
格式化压缩的代码
Pretty printsee -
运行到指定行
Continue to Heresee -
条件断点
首先设置一个断点，然后右键该断点选择
Edit breakpoint在弹出的输入框中填写具体的条件即可 - 在异常的行触发断点 see
-
动态修改内容 see
在
Sources界面内选择某个js文件直接修改，然后使用Ctrl + S或者Cmd + S。这样即可及时生效 -
异常栈查看 see
在右下角有一个打叉的小图标（以js出错为前提）。点击可以查看详细的栈信息，如需查找对于的代码请先点击左边的小三角形图标在展开的栈中点击靠右边的js文件名。如果在代码中像打印栈可以通过
console.log(e.stack)，打印当前代码调用栈可以通过console.trace() -
断言
console.assert(var1 !== undefined, "no var1") - Source Maps 用于关联源码位置 see
HTML相关调试
-
DOM变化断点 see
切换到
Elements界面，右键需要监控的元素选择Break on...(就的版本可能不需要这个) –>Break on Subtree Modifications。这样元素的内部发生变化时会触发断点 -
XMLHttpRequest(平常是由JavaScript发起的请求)请求中断
在
Sources界面的右边找到XHR Breakpoint添加URL中包含的字符，这样在发送请求时会触发断点 -
事件断点（鼠标事件、键盘事件等）
在
Sources界面的右边找到Event Listener Breakpoint勾选需要的事件，这样在发生事件时会触发断点
