Js问题定位调试.docx

Js问题定位调试使用相关调试器●??在Firefox 浏览器中，可以使用其自带的“错误控制台”。操作步骤如下： 打开Firefox 浏览器→在菜单条“工具”中→选择“错误控制台”即可。 在没有其他插件的情况下，其自带的“错误控制台”是一个非常不错的选择。?另外，在Firefox 浏览器中，还有一些很不错的调试器，如：Firebug 等。 Firebug 调试器安装后，可以在Firefox 浏览器→在菜单条“工具”中→选择“Firebug”→选择“打开 Firebug”即可,默认快捷方式是F12；?●??在chrome浏览器中，可以使用其自带的“错误控制台”来调试Chrome Developer Tool●??在IE 浏览器中，可以使用 Microsoft? Script? Debugger 调试器?下载安装以后，必须将IE 浏览器的调试选项打开才能使用。操作步骤如下： 1 打开IE 浏览器→选择菜单栏的“工具”→ “Internet 选项”命令→ “高级”选项卡→将“禁用脚本调试（Internet Explorer ）”复选框中的勾去掉即可。 2 当IE 浏览器正在浏览页面时，运行Microsoft? Script? Debugger 调试器工具即可进行调试。?对于IE浏览器,低版本的兼容问题比较棘手,可以采用IEtester来模拟不同的IE版本来调试问题(当然,有些问题在IEtester下并不能重现)常用调试方法2.1添加断点可以采用上述的调试工具进行添加断点来实时跟踪变量的值的变化2.2使用alert() 和document.write()或者console.log()方法监视变量值如果要中断代码的运行，监视变量的值，则使用alert() 方法；如果需要查看的值很多，则使用document.write() 方法，避免反复单击“确定”按钮；对于console.log(),低版本的iE是不支持的,当代码编写完成后,应该记得将其去掉2.3?使用window.onerror事件当页面出现异常时，onerror事件会在window 对象上触发。它能在一定程度上告诉开发者相关的错误信息。示例：注意：在IE 中，触发error 事件后，正常的代码会继续运行，所有的变量和数据都会保存下来，在其onerror事件处理方法中可以正常访问到；而在Firefox 中，触发error 事件后，一切都结束，所有的变量和数据都将被销毁。2.4使用 try...catch 语句找错误?script?type=text/javascript?function?myerror(_message,_url,_line)?{?alert(错误信息：?+?_message?+\n错误的URI：?+?_url?+\n错误的行数：?+?_line?);??return?true;?//屏蔽系统的事件?}?//绑定错误事件?window.onerror?=?myerror;??//触发错误示例：?window,onload?=?test;?/script注意：try...catch 并不能很好的处理JavaScript 的语法错误,但是可以大致找到错误发生的区域常用错误问题表现3.1直接报js语法错误?这是最简单的,需要检查是否因为多敲了个括号},或者是变量名写错,表示为声明,总之这种问题很好追踪.3.2 js报错，但报错地点不是出问题的根源?这种情况大部分可以解决，但有时候完全不知道是从哪里引用过来的，这种时候会相当的头疼。3.3 js无报错，但功能无效这种情况更糟糕，完全没有头绪了……那我告诉你，往往这种时候最终解决错误的方法更容易。根据特征，往往能够快速定位错误的大概位置，便于进一步查找问题。3.4 Js在某些浏览器中有效,某些浏览器中无效这就涉及到了浏览器中js的兼容性问题,一般情况下是低版本IE(IE8及以下)和其他高级浏览器之间的差异.当然也有高级浏览器之间的兼容性问题.对于这些问题一般是需要查阅资料和丰富的调试经验.3.5. 功能基本正常，但是偶现bug这种问题不好定位，因为时出现不是出现，最关键的问题是要注意抓住细节，找准规律，判断到底是什么情况才会出现，这样，就可以轻松解决了。在这里，我举两个例子：在之前第一个版本的体检系统中，由一个同事负责人员登记页面的开发，由于上面的功能还是相对复杂，他花了较长时间，测试后终于觉得功能没有问题了，但是当要开发下一个功能的时候，发现这个功能有一个文本框偶尔不能回设上值。后来经过反复测试重现，最终发现原来是他的这个文本框的id和其他页面的id冲突了，也就是说单独打开这个页面的时候是正确的，但是打开多个页面id冲突后就不正常了。在第二个版本的体检系统中，周雷发现在打印健康证的时候，在IE8下面会出现第一次点击打印时会不生