工具/原料
chrome浏览器 Mozilla firefox 电脑
方法/步骤
1、以chrome为例，首先打开需要调试的页面，按F12快捷键打开调试工具。
2、选择指定的dom节点进行查看和编辑。
3、js断点调试：chrome非常强大，在chrome调试工具栏中，你可以进行js断点调试以及格式化查看（一些大型的门户网站都会将js压缩成无任何格式的代码这在研究时特别费劲）：我先写一段简单的js代码：function debug(){for (var i=0i<10i++){alert(i)}调试截图如下：
4、js ajax调试，ajax技术如今越来越频繁使用，所以，ajax调试也必不可少：在chrome调试工具中，可以查看到当前页面所以的请求，包括ajax请求，以下是页面打开后所有发起的请求。
使用firefox进行网页js调试的方法：
1、用Firefox浏览器打开该页面，在浏览器的打开浏览器的工具栏，找到开发者选项按钮
2、点击进入，勾选开发者工具栏
3、完成后，看到浏览器最下方出现开发者选项的工具标识和关闭开发者工具栏的x标识
4、单击开发者选项的工具标识进入查看器页面
5、查看器页面有查看器，控制台，调试器，样式编辑器，性能，网络等tab页。
点击调试器tab页，刷新要调试的页面，调试器主窗口会出现要调试的代码
点击点击暂停 按钮，点击后按钮状态改变，同时右边的三个调试步骤变为可操作状态，调试步骤的作用可参考IE浏览器javascript调试篇的讲解。同时，在代码行上面打断点。点击断点后，代码自动进入调试状态，取消断点，代码直接运行过去。
1、打开firebug,点击“脚本”选项。
2、点击“所有”选项，这里可以选择要显示的脚本，建议选择“显示所有脚本”。
3、在“所有选项”的旁边，是当前显示的JavaScript文件的名字，点击它，可以看到当前页面用到的所有JavaScript文件，在列表里找或者直接在列表的搜索框搜索你要调试的JavaScript文件。
4、在脚本正文行号的左边点击，可以在此行设置断点，程序运行到此行就会暂停。
5、此时红点上会有个黄色箭头，代表此行即将被执行。右边的监控栏可以输入你想监控的表达式，查看它的值。
6、脚本正文右上角有四个图标，第一个图标表示取消此次调试，但如果下次程序执行到此断点还是会暂停；第二个图标表示单步进入程序；第三个图标表示单步跳过程序；第四个图标表示单步退出。
注意事项
调试完脚本后，记得清除断点，在红点位置点击一下就行了。
