使用MSE调试js攻略

相关推荐:  

• Programming Windows
• Programming Windows(中英两版)
• Programming Windows程式开发设计指南->第一章 开始
• Programming Windows 基础部分（一）(bigtoog译）
• Programming Windows （一）_ Windows 的运行机制

更多相关推荐

你有没有写过js?有没有经历过js出错时痛苦的调试过程？有没有写了一堆的alert()来打印变量的值，导致弹出框弹出的声音差点让你崩溃？你是否在寻找一种方式，让你能像调试java一样调试js?

 如果你的回答都是“是”，那么请看本文，肯定收益不少。

（好像上传图片比较麻烦，要看带图片版的请下载附件）

  

 

首先当然要知道 Microsoft Script Editor有没有安装好：

其中一种方法

-        打开Microsoft word右击工具条，选择 “web tools” 或者点View >Toolbar->Web Tools

 

-        点击 Microsoft Script Editor 图表 (见下图 – 红色框框内的图标)

 

 

点击了以后，如果已经安装好，就会打开Microsoft Script Editor，如下图：

如果没有安装好，它会提示你要安装，点击确定安装好了。

 

一般情况下，经过安装以后Microsoft Script Editor就处在可用状态了，但是在比较特殊的情况下，还会有一些问题。比如你不是管理员，那么有时候在点击debug/processes菜单的时候会出现如下的错误：

这种错误表示你的windows用户没有debug的权限，需要到控制面板里面将你的用户加入到debug组里面。

 

完成这些步骤以后，你的debugger已经处于可用状态了，但是离debug js还有一点点距离。因为ie还需要做一些设定。打开ie,到advanced里面把画红圈的两项内容去掉。

这样可以让脚本在有错误的情况下弹出debug入口：

 

自己找一个有脚本错误的文件，在弹出上面警告框的时候点确定，就可以进入debug界面了。

但是有时候会出现比较奇怪的问题，点了确定但是并没有打开debug，如果操作系统是win2k这种情况很可能出现，什么原因不清楚，解决的办法是事先把Microsoft Script Editor打开，然后再弹出那个警告框的时候就可以调试了。前面说到这个Microsoft Script Editor是藏在word里面的,如果每次都要打开word去吧它打开也太麻烦了，所以找到他的实际路径，做个快捷方式。它一般藏身与Microsoft Office安装路径\OFFICE11\下面，名称为MSE7.EXE。

打开debugger前还会有一个对话框，如下图所示：

上面有两个possible debugger，这是因为我的系统是win2k,我事先已经打开了一个，如果我事先不打开一个，那么possible debugger就只有一个，但是却不能工作：（

所以，在这种情况下，不能选new instance，可能在别的操作系统环境下，情况不同，这要靠自己试验了。点确定以后，还会出现一个对话框，直接点确定就是。这个时候他一般就会比较准确地定位到你出错的那一行代码上了。如下图所示，

有时候，他会打开多个两个文档，一个是js定义的，另一个是调用这个js的，如上图右边所示，你可以在两个文档之间切换一下，看看哪里是真正的根源。

出错以后的调试能做的事情好像不多，因为如果不停止debug，他一直会纠缠于出错的代码，导致没法往下执行。只能看看一些变量的值。选中一个变量，按shift+f9可以quick watch。当然也可以点右键加入watch。这样变量的值就显示出来了，这一招在调试的时候非常有用。再也不用写烦人的alert(xx)来显示一个变量的值了，尤其是你alert(xx),这个xx不幸是个object的时候，你就会看到令你吐血的结果。

出错后调试可能很多人用得比较多，但是在代码出现一些逻辑错误的时候，我想象java或者别的代码一样跟踪js的执行过程可不可以呢？答案是肯定的，你是不是觉得生活突然美好了许多？

OK,让我们来看看怎么做到。

首先确保你在出错的情况下已经可以顺利地调试了，不然先对照文档，把该设置的设置好。

打开一个页面，点view菜单，可以看到多了一项：script debugger,如下所示：

点open就可以进入调试器了。

不过有时候（经常地）你看到的是这样的场景：

哪里有script debugger?我不知道为什么会这样，也许微软的人知道。不过幸亏解决这个问题并不难，只要在这个窗口下安ctrl+N，打开一个新窗口就行了。这个新窗口会复制原来的窗口所有的内容，包括session，所以跟原来的窗口基本上是一模一样的。经过这样操作以后，这个script debugger 99%就出来了。如果还不出来，多试几次。

这的确比较令人抓狂，不过我想，是不是由于这些原因，所以一直没有详细的官方操作手册之类的东西呢？这个东西莫名其妙的地方太多，大家要结合自己的“机情”，反复揣摩其心思，建设一个XX特色的调试环境。

言归正传，现在进入了调试界面，点左边灰色的条就可以增加一个断点，再点一下就可以，去处，也有快捷键，一般是ctrl+alt+b。

接下来就是最激动人心的地方了，按f10可以让js代码单步执行，爽吧？不过有的人的机子上是f11。自己找找，反正是这几个键。同时你可以将变量加入watch观察其值。爽啊，反正我第一次发现这个功能的时候激动了好久，一直激动到手指头有点酸了：代码太长，这么一步步的何时是尽头啊。幸亏还有一个键，f5，可以让你直接执行到下一个断点。如果下一个没断点了就执行完以后返回到你的IE,这个功能非常有用哦。你可以在ie的页面上填好东西，然后按按钮之前跑到debugger里设个断点，然后按下按钮，这时debugger就会停在你的断点上。

从现在开始，享受js代码的开发吧！

声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。