外部JScore文件调试怎样调试

2009年12月 Web 开发大版内专家分月排行榜第二
2009年10月 Web 开发大版内专家分月排行榜第三
2005年1月 PHP大版内专家分月排行榜第三2007年8月 PHP大版内专家分月排行榜第三
匿名用户不能发表回复!|2010年5月 扩充话题大版内专家分月排行榜第二2009年7月 扩充话题大版内专家分月排行榜第二
2010年11月 Web 开发大版内专家分月排行榜第三
2008年10月 PHP大版内专家分月排行榜第二2008年9月 PHP大版内专家分月排行榜第二2008年4月 PHP大版内专家分月排行榜第二2007年12月 PHP大版内专家分月排行榜第二
2008年10月 PHP大版内专家分月排行榜第二2008年9月 PHP大版内专家分月排行榜第二2008年4月 PHP大版内专家分月排行榜第二2007年12月 PHP大版内专家分月排行榜第二
匿名用户不能发表回复!|目前,常用的浏览器IE、Chrome、Firefox都有相应的脚本调试功能。作为我们.NET 阵营,学会如何在IE中调试JS就足够了,在掌握了IE中的调试方法以后,Chrome和Firefox中的调试方法也变得相当简单了。
在F12开发人员工具中进行调试
打开IE浏览器,按下F12键,就会打开开发人员工具,这是IE内置的开发人员开发工具,方便开发人员对HTML、CSS、Javascript等网页资源进行跟踪调试使用的。
如果你打开的时候没有固定在网页底部,可以点击右上角菜单栏中的按钮来完成。
我们看到在这个工具窗口里面有几个标签页,分别是:HTML、CSS、控制台、脚本、探查器和网络,点开每一个标签,可以执行相应的任务。
在HTML标签窗口中,工具栏中的按钮所执行的操作如下图:
CSS标签是用来查看样式的;控制台显示网页中JS的各种输出信息,包括错误信息、用户日志等;打开脚本标签页,这里面才是我们想要的内容。
我在图中用黄色矩形选中连个控件,左侧的下拉列表用来选择文件,右侧的按钮用来启动调试。当点击启动调试后,调试程序会将窗口最大化,我们在选中的文件中找到需要调试的位置,点击左侧边栏添加断点即可进行调试。
当有程序运行到我们的断点处时,就可以进行调试了。
在这里,我们可以使用快捷键进行操作,常用的快捷键如下:
F9:添加/移除 断点
F10:逐过程,即跳过该语句中的方法、表达式等
F11:逐语句调试,即单步调试,会跳入方法、表达式,进行逐语句的跟踪调试
在执行过程中,如果我们要执行即时的代码,我们就需要在右侧的窗格中输入代码,按回车即可。
如果要执行多行代码,点击运行按钮右侧的双箭头,就会打开多行模式。我就不再截图片了。
这种直接在浏览器中调试的方法同样适用于Google浏览器Chrome和FireFox FireDebug,只不过在细枝末叶上面有些不同罢了,主体的功能都是一样的。
按F12键进入开发者工具,可以查看源代码、样式和js。
点击Scripts按钮,可以打开这个调试窗口,里面包含了网页中脚本文件源码,点击左侧的按钮可以打开选择文件的侧窗口。右侧有调试的工具按钮,不过我不喜欢这些纯英文的界面,所以大部分的调试都还是在IE下进行。并且会在IE下转到VS中。
下面我就介绍如何在VS中调试我们的JS代码。
使用debugger关键字进行调试
这种方法很简单,我们只需要在进行调试的地方加入debugger关键字,然后当浏览器运行到这个关键字的时候,就会提示是否打开调试,我们选择是就可以了。这种调试可以选择调试工具,是新打开vs还是在现有的VS中调试,都可以选择,个人比较喜欢这中调试方式。
当我们运行这段程序的时候,会弹出调试提示窗口:
如果你的浏览器没有弹出这个窗口,你需要进行一下简单的设置,打开Internet选项:
将红色方框中的两项取消勾选就可以了。
设置以后就可以使用debugger关键字进行调试了;进过这样的设置,我们还可以捕获到意外的错误,进行跟踪调试。
好了,本文就介绍到这里,有不明白的地方请和我交流。调试是一个实践的过程,只有使用次数多了,才能掌握其中的方法和技巧。
----------------------------------------
阅读(...) 评论()其他回答(2)
路径是对的,问题是方法不是这么调的啊
看着没有问题,你把路径改成绝对的试试。清空浏览器缓存。
园豆:40785
清除回答草稿
&&&您需要以后才能回答,未注册用户请先。Google Chrome 调试JS简单教程
我的图书馆
Google Chrome 调试JS简单教程
我是一名忠实Chrome迷,使用它已经快有2年的历史了,整体给我的感觉就是清爽,快速,简洁。又打小广告了……^_^,虽然我知道IE8+也有调试工具,包括火狐的什么XXBUG,但是我用过之后,个人还是十分偏爱chrome的debug。chrome对于在前端打拼的兄弟姐妹是十分有帮助的,它优雅的实时展示DOM,捕获N个ajax传递过来的参数&查看动态DOM&获取ajax请求数据预览包括chrome中N多插件……当然我在这里列举一个十分有用的javascript调试的技巧首先请打开“谷歌浏览器”(废话),然后打开一个网页,按“F12”会出现一个控制台,找到一个叫做“Sources”,点击它OK,如果你的页面现在已经加载过JS脚本的话,那么应该可以看到一些JS文件了然后你可以在左侧侧栏的序号那些位置点击一下就设置成断点,当你要执行某个函数的时候浏览器就会自动进入调试模式了细心的你肯定会发现Scope Variables区域显示的竟然就是Object对象的元素,大惊。起初我们要想展示一个对象要么采用12345function forIn(o) {&&&&for (i in o) {&&&&&&&&document.write('&strong&' + i + ' --&&/strong& ' + o[i] + '&br /&');&&&&}}你会发现页面很麻烦,而且也不是很灵活,现在学会chrome的debug工具我相信会给你带来莫大的帮助了。==更新==当我们在打开chrome的时候,你就已经被google至简给深深吸引,到现在chrome的版本已经到了&30.0. m,google的东西确实很赞。好滴,我补充一些我后来慢慢用到的内容给大家,算是我自己的工作笔记吧。一般我们打开的大部分的网站有些js文件是已经被yui\uglifyjs等js压缩工具压缩过的代码,让你看格式来进行调试十分不容易(根本就不可能)。chrome中也提供了一个格式化代码的功能。&点击图上圈红(pretty print)的按钮立即将当前文件进行标准格式了。我啰嗦一句,这个格式化代码目前我只知道能格式化dom和js,css文件没有格式化效果当然也就不支持了。关于js调试的几个控制简介js控制面板就是在顶部的侧面板,这几个工具条可以让你按步执行代码。继续:继续执行代码,直到我们遇到另一个断点。步骤:忽略方法体内部,也就是不进入到方法体内部细节再执行,只调用取返回值继续在当前执行下步。进入细节:细节逐语句执行,进入方法体再执行。退出细节:细节语句返回主函数体。断点开关:决定该断点是否开启/关闭。&上面这些内容只是一些粗略的手记,如果你需要更加深入的了解chrome的DevTools不妨来,这里绝对是一手资料而且十分详细和权威,如果你有幸被墙,那么恭喜你,你要学会怎么搭建梯子,这个问题你可以google或者度百。
TA的最新馆藏
喜欢该文的人也喜欢

我要回帖

更多关于 linux core文件调试 的文章

 

随机推荐