`
jimmy.shine
  • 浏览: 396308 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

How to debug Javascript

    博客分类:
  • Ajax
阅读更多
---By Jimmy.Shine

调试Javascript的方法,整理笔记时发现,与大家共享。
@see Professional JavaScript for Web Developers by

Nicholas C.Zakas,by Wiley Publishing
     JavaScript高级程序设计 人民邮电出版社出版中文版
  
  Venkman 作为Mozilla的调试器,是针对Mozilla(Firefox)的自

由工具。安装路径为:

http://www.hacksrus.com/~ginda/venkman/。在此,会发现一个

vendkman的列表,点击最新版本旁边的Install的链接。
1. 要运行Venkman,可点击Tools->Web Development->JavaScript

Debugger来手工打开窗口。此后,venkman的窗口会将所有包含有

javascript的文件自动载入调试器窗口。也可以在代码中使用

debugger命令。一旦遇到debugger命令,调试器会自动开启并在这

一行代码上停止执行。
2. 在Venkman中的视图
   1)Loaded Script
   显示包含JavaScript的文件,HTML或是外部JavaScript文件。

然后展开每个文件会出现其中包含的函数,显示函数名和函数开始

的行号。
   2)Open Windows
   显示Mozilla打开的所有浏览器窗口(和标签页)。在每个窗口下

是已经载入的HTML文件,再下面是JavaScript文件的列表。可以通

过右键点击文件然后选择Set As Evalution Object来在不同的窗

口之间切换调试器的焦点。
   3)Local Variables
   遇到断点时,该视图中便会出现正在执行的代码的范围内可用

的所有变量的列表。如果变量包含的是对象,也可以展开变量名来

查看对象所有的特性。在断点处停止执行后,如果要更改变量的值

,可以双击变量名,然后输入新的值。
   4)Watches
   显示调试器会话的监视器的列表。监视器的工作就是监视变量

值的变化。一旦变量的值发生变化,Watches视图中就会自动更新


   5)Breakpoints
   显示调试器会话中已经注册的断点的列表。
   6)Call Stack
   遇到断点时,该视图会显示调用堆栈(到断点处的函数调用的序

列)。
   7)Source Code
   显示任何包含JavaScript的文件的源代码。
   8)Interactive
   一个传统风格的调试器的命令行界面。在这个视图中,利用文

本命令几乎可以控制调试器的任何方面。

3. Loaded Script面板
   利用此面板可以打开或者是关闭要调试的代码。
4. 断点
   在Venkman的各种设置断点的方法中,用鼠标双击左边的空白。
   也可以使用命令:
   /break file.html 23      设置断点     
   /fbreak file.html 7      设置未来断点
   以上函数都包含二个参数:文件名 行号
   可以通过点击断点的设置处来取消断点的设置。
   /clear file.html 23        取消断点
   调试工具栏的五个按钮。
   调试按钮        文本命令
   stop            /stop
   Continue        /cont
   Step Over        /next
   Step Into        /step
   Step Out         /finish
分享到:
评论
3 楼 afcn0 2007-09-30  
直接把xpi文件拖到firefox窗口上也可以
2 楼 jimmy.shine 2007-09-30  
Re grantgreat:

看来你从来没有安装过firefox的插件,你可以点击firefox的菜单中的 工具-->附加软件-->获取扩展 再搜索一下javascript debugger,进入后,你就知道如何安装了。
dow
1 楼 grantgreat 2007-09-29  
下载的是一个xpi文件,怎么安装呢??

相关推荐

    [Advance] How to debug a program

    在 "[Advance] How to debug a program (上)" 和 "(下)" 的示例中,我们可以看到如何通过调试工具逐步定位并解决问题的过程。图片可能展示了断点设置、变量值的观察以及问题解决的步骤。 总的来说,高效的调试技能...

    JavaScript for .NET Developers(PACKT,2016)

    If you want to improve responsiveness or the UX in your ASP.NET applications, JavaScript can be a life saver. In an age where server-side operations have shifted to...See how to test and debug JavaScript

    Beginning JavaScript with DOM Scripting and Ajax: Second Editon

    As well as focusing on client-side JavaScript, you will also learn how to work with the Browser Object Model, the Document Object Model (DOM), how to use XML and JSON as well as communicate with ...

    Beginning JavaScript with DOM Scripting and Ajax (pdf + ePub)

    As well as focusing on client-side JavaScript, you will also learn how to work with the Browser Object Model, the Document Object Model (DOM), how to use XML and JSON as well as communicate with ...

    英文原版-JavaScript for NET Developers 1st Edition

    Unlock the potential of evergreen browsers and increase the efficiency of your ASP.NET applications by learning how to write JavaScriptIf you want to improve responsiveness or the UX in your ASP.NET ...

    Mastering.JavaScript.1785281348

    By the end of the book, you will understand how reactive JavaScript is going to be the new paradigm. What you will learn - Get a run through of the basic JavaScript language constructs - Get familiar...

    Mastering JavaScript(PACKT,2016)

    By the end of the book, you will understand how reactive JavaScript is going to be the new paradigm. What you will learn Get a run through of the basic JavaScript language constructs Get familiar ...

    Javascript.Object.Oriented.Programming.pdf

    Learn the latest ES6 features and how to test and debug issues with JavaScript code using various modern mechanisms Who This Book Is For JavaScript developers looking to enhance their web developments...

    英文原版-Learning ECMAScript 6 1st Edition

    ES6 gives a vast makeover to JavaScript by adding new syntaxes and APIs to write complex applications and libraries that are easier to debug and maintain. ES6 aims to keep JavaScript accessible for ...

    Learning ECMAScript 6(PACKT,2015)

    ES6 gives a vast makeover to JavaScript by adding new syntaxes and APIs to write complex applications and libraries that are easier to debug and maintain. ES6 aims to keep JavaScript accessible for ...

    Learning React Native Building Native Mobile Apps with JavaScript 2nd Ed (MOBI)

    Through code examples and step-by-step instructions, web developers and frontend engineers familiar with React will learn how to build and style interfaces, use mobile components, and debug and deploy...

    Learning Redux

    You are going to learn how to integrate and use Redux DevTools to debug applications, and access external APIs with Redux. You are also going to get acquainted with writing tests for all elements of ...

    Learning React Native - Building Native Mobile Apps with JavaScript 2nd Edition

    Through code examples and step-by-step instructions, web developers and frontend engineers familiar with React will learn how to build and style interfaces, use mobile components, and debug and deploy...

    Closure The Definitive Guide

    You'll learn all about Closure's Library, Compiler, Templates, testing framework, and Inspector -- including how to minify JavaScript code with the Compiler, and why the combination of the Compiler ...

    Building Android Apps with HTML,CSS,and.JavaScript(2nd,2012.01)

    Test and debug your app on the Web under load with real users, and then submit the finished product to the Android Market This book received valuable community input through O'Reilly's Open ...

    Building Android Apps with HTML, CSS, and JavaScript

    Test and debug your app on the Web under load with real users, and then submit the finished product to the Android Market This book received valuable community input through O’Reilly’s Open Feedback...

    JavaScript in 10 Minutes

    7. **Silent Failures**: Lists scenarios where JavaScript silently fails or misbehaves, which can be hard to debug. 8. **Numeric Coercion**: Details how JavaScript coerces non-numeric values into ...

    essential debugging javascript.pdf

    Javascript debugging is hard. This book shows you how to resolve the hassle.

Global site tag (gtag.js) - Google Analytics