本文总结了JavaScript脚本调试的多种实用方法。重点介绍了通过Internet选项启用脚本调试功能,以及在代码中使用debugger语句配合Visual Studio进行断点调试的技巧。此外,还涵盖了使用alert输出变量、利用编辑器语法高亮检查拼写错误、严格区分大小写、规范代码缩进以及借助FireBug等浏览器插件进行错误排查的具体操作与注意事项。
这是较为原始的方法,但调试过程较为繁琐。
2、debugger方法
启用脚本调试环境
首先,在Internet选项中进入“高级”设置,取消勾选“禁用脚本调试(Internet Explorer)”选项。
若需在其他浏览器中启用调试功能,请同时取消勾选“禁用脚本调试(其他)”选项。
使用Debugger语句调试
在需要调试的代码位置插入debugger语句,例如:
<script type="text/javascript">
debugger;
var s="debugger可调试";
alert(s);
</script>
使用IE浏览器打开该页面后,系统会自动调用VS2005进行调试。
点击确认后,即可像平时一样按F10或F11键进行单步调试。
从事或准备从事JavaScript编程的人员通常会使用这一功能,并对此感到自豪。
它几乎能在不借助其他工具的情况下实现所需的任何调试功能。
然而,使用过该功能的人都知道,这种脚本语言的错误查询或调试过程相对繁琐。
下面结合个人经验及部分网络资料进行说明。
1、使用alert函数
其他调试技巧与注意事项
该函数在调试中使用频率最高,针对可能出问题的变量或数组,可在相应位置使用alert进行输出。
2、使用编辑器的语法高亮功能
对于可能存在拼写错误的地方,使用具备语法高亮功能的编辑器是一个好方法。目前支持语法高亮的编辑器较多,如EditPlus、UltraEdit、Dreamweaver等。如果在编写代码时有关键字(或保留字)拼写错误,编辑器会以不同颜色提示。
document.write("hello World!");
若上述语句中的保留字发生拼写错误,编辑器会给出颜色提示。
documents.write("hello World!");
3、注意大小写区分
注意,HTML本身不区分大小写,但将JS代码直接嵌入HTML中时,会表现出区分大小写的特性,这一点需特别注意。
在脚本语言中必须严格区分大小写,若拼写错误,不仅颜色显示异常,还会导致方法执行错误,程序无法继续运行。
4、括号配对检查
此处括号包括常用大括号和小括号,检查时需重点关注括号的匹配情况。
5、严格执行代码缩进风格
这一点同样重要,尤其在排查错误时。保持这种风格能显著节省时间。
6、使用浏览器运行调试
实际上,每种浏览器都具备错误显示功能,如IE系列、Firefox等,只是容易被忽略。这里重点介绍Firefox的调试功能,它非常实用。
Firefox自身带有错误控制台功能,开启后会提示错误信息。
当然,最好用的还是Web Developer和FireBug插件,关于这两个插件的使用方法已有许多文章介绍。