AJAX技术在WEB开发中是一种最常用的开发技术，因为具有的一些优秀的特点，成为广大程序员优先使用的技术之一。AJAX可以在局部刷新的情况下从服务端抓取数据，给用户良好的体验，而传统的页面刷新则采用重定向或者是转发的方式，需要整页面的刷新，在刷新期间会出现一个空白页。AJAX技术从诞生到现在已经变的相当稳定，同时也出现了很多开源框架，例如大名鼎鼎的jQuery，Ext JS等框架，这些框架的出现不仅可以很好的解决局部刷新的问题，还有诸多好处，例如：浏览器特征屏蔽，使用这些框架不用考虑浏览器兼容性的问题；快速开发功能界面，Ext JS提供了丰富的用户控件，使用这些控件，大家可以快速的开发出所需的功能界面。

AJAX给程序员带来诸多好处的同时，也给软件的开发调试带来了很多困难，软件调试是软件开发过程中的一把牛刀，用好这把牛刀，大家可以在开发过程中游刃有余的解决问题。本文主要讲解如何利用浏览器的调试器来调试AJAX程序。

 

1   使用IE的调试器调试AJAX程序

     在IE9以上的版本里，已经内置了调试工具，IE9以下的版本，需要自行安装，大家可以在百度上搜索IE调试工具，自行下载，本文不在阐述。

浏览器调试工具可以为我们做很多事情，例如查看HTML代码、查看资源的网络状态、控制台、脚本调试等功能，下面我们依次讲解一下这些功能。按F12键，可以打开IE调试工具。如下图：

 

 

1.1         HTML调试

    HTML选项卡可以查看HTML元素，任何显示在界面中的HTML元素和隐藏元素都可以在这里看，给调试HTML代码带来极大的方便，使用“单击选择元素”的小箭头可以快速选和定位元素。

 

 

     下面我们用小箭头来定位“消费项目管理”菜单，结果如下：

 

    

       在右侧的小窗口中可以修改样式，并且可以立即在浏览器中生效，用这种办法调试样式，可以不用更改代码，待样式调好后，再更改对应的代码，省去了频繁的修改代码和发布代码的麻烦。

 

1.2         网络资源调试

     网络资源调试器是AJAX调试中非常重要的调试步骤，用好了网络资源调试器，可以快速定位服务端的问题，例如服务器500异常，图片无法下载（404），服务端超时，性能测试等等问题。网络调试需要熟悉几种常见的HTTP状态，下面给出常见的HTTP状态对照表：

 

200

请求已成功，请求所希望的响应头或数据体将随此响应返回

304

文档未改变

404

资源未找到

500

服务器异常

 

下图是网络调试窗口：

 

    

         

 

 

1.3         脚本调试

 

     AJAX的核心是Java Script，在编写脚本的过程中，通常会遇到各种各样的问题，各种服务端语言例如Java、C#、C++等等语言都有自己的调试器，可以进行逐过程和逐语句的调试，为程序开发带来了很大的方便，很多莫名其妙的问题，看一下堆栈瞬间就明白了，既然调试器在软件开发中是如此的重要，那么Java Script到底有没有调试器呢？当然有啦，不过IE推出调试器比Firefox晚，IE6版本的调试器是很难用的，但后续的IE版本都有增强，到了IE9，调试器功能也可以和FireBug有的一比了，我想大概是因为Firefox是开放技术体系的原因，因为FireBug本身也是有网友编写的开源软件，而IE则是一直不开放源码的，所以IE调试器一般都是由微软官方推出，也许是微软人力资源有限的原因，所以推出的调试器比市场其他浏览器要晚。由于Windows操作系统在中国是主流操作系统，所在大家在开发WEB程序时也是以IE作为主要浏览器，所以，WEB程序在IE浏览器上的兼容性显得尤为重要。IE的脚本调试器和其他语言一样，首先需要设置断点。将调试器切换到脚本选项卡，并在你需要调试的脚本中设置一个断点，双击代码对应的行即可，这里，我们对第32行代码设置断点，然后启动调试，单击某一个菜单后，程序进入调试状态，并且以黄色背景高显示，如下图：