ajax技术和其在web应用程序开发中应用

《ajax技术和其在web应用程序开发中应用》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、AJAX技术和其在WEB应用程序开发中应用　　摘要AJAX技术是将Java技术、XML、DOM以及JavaScript等编程技术，按一定的协作方式合理组合在一起，来充分发挥各自的作用。通过在用户和服务器之间加入AJAX引擎（AJAXengine），使用户操作与服务器响应实现异步化，从而增强WEB应用的交互性，可以开发出基于浏览器的具有高用户交互性的WEB应用，构建出更为灵活、页面更为丰富和用户体验更好的WEB应用程序。本文介绍AJAX技术的有关概念、关键技术以及应用方法。关键词AJAX；WEB应用；异步交互中图分类号：TP3文献标识码：A文章编号：1671—7597（201

2、3）051-077-026在传统的WEB应用程序中，用户和服务器之间是一个同步交互的过程，用户在客户端向服务器提出请求，服务器端收到请求后进行处理，然后再将处理结果以全新的页面发送回客户端。用户提交请求后，不能进行其它操作，服务器需要一定时间对请求进行处理，使得用户得不到立即反馈。AJAX引入了异步请求的技术，在用户和服务器之间增加了一个中间层，使得用户在提交请求后不用等待服务器的响应，可以继续操作使用应用程序，WEB站点看起来是即时响应的。现在AJAX技术已经在面向消费者的WEB应用开发中得到广泛的应用，如Amazon的A9搜索引擎、Google的Gmail和Google

3、Maps。1AJAX与传统WEB应用1.1传统的WEB应用传统的WEB应用程序大多采用B/S结构，系统与用户之间同步交互。用户对浏览器操作向服务器端发送一个HTTP窗体请求，服务器端接收到请求后，判断用户的请求行为，处理来自各种数据源的数据信息，设置相关属性值后加入到服务器返回给用户的信息内容中，即一个HTML页面。这个过程不是连贯的用户体验，用户提交请求后，不能进行其它操作，服务器需要一定时间对请求进行处理，用户处于等待状态，浏览器上大部分显示空白。在服务器负载比较小时，这种同步交互方式工作没有任何问题。但是当服务器负载较大时，服务器需要更多的时间进行处理运算来响应用户的

4、请求，过长的等待服务器响应时间对于用户来讲是不能接受的，有时用户经过长时间等待收到的可能是服务超时的错误消息。还有一种情况，当用户只是想对页面中一小部分的内容进行修改时，浏览器却仍然需要对整个页面的数据进行加载刷新，这样即浪费上网流量，又占用大量时间，工作方式缺乏人性化。传统WEB应用请求响应过程如图1所示。1.3AJAX的概念AJAX全称为“AsynchronousJavaScriptand6XML”，是一种创建交互式WEB应用的手段，它采用客户端脚本来实现与服务器端进行交换数据。可以动态、灵活的更新WEB页面。AJAX技术是将Java技术、XML、DOM以及JavaSc

5、ript等编程技术，按一定的协作方式合理组合在一起，来充分发挥各自的作用。这些技术有Javascript、XSTL、XHTML、DOM、XML、CSS及XMLHttpRequest。AJAX技术的出现和使用使得WEB应用的交互性得到了很大提高。1.3AJAX的工作原理AJAX的工作原理是在用户和服务器两者之间加了一个中间层AJAX引擎（AJAXengine），实现用户操作与服务器响应间异步交互模式。在这种模式下，一部分用户请求如数据验证和简单的数据处理请求去交给AJAX引擎完成，确实需要服务器端完成的请求，才由AJAX引擎向服务器提交，减少了页面重载次数，使用户感觉所有的操

6、作很快得到了响应，交互性大大增强。AJAX应用模型如图2。AJAX引擎接收处理请求的流程为：1）捕获WEB浏览器事件，对应不同事件注册一个处理函数。2）在客户端浏览器初始化XMLHttpRequest请求对象。3）与服务器建立连接，向服务器发送请求。4）接收服务器响应对处理结果进行分析。5）使用DOMAPI更新客户端页面内容。62AJAX的关键技术鉴于AJAX涉及到的技术较多，本文着重对XMLHttpRequest、DOM、XML、JavaScript几种技术的使用进行说明。2.1XMLHttpRequestXMLHttpRequest对象是AJAX技术中最核心的部分。利用

7、这个对象，AJAX不用刷新页面即可与服务服进行数据的传输和读写。它只与服务器进行数据交换，减轻了服务器的负担，减少了等待响应时间，用户与服务器交互更为流畅。2.2DOMDOM全名为“DocumentObjectModel”，是W3C组织的推荐标准。该模型是JavaAPIforXMLProcessing的组件API。该DocumentObjectModelLevel2CoreAPI允许程序动态访问和更新文档的内容和结构。脚本或程序语言通过DOM与网页进行交互沟通。2.3XMLXML全名为“ExtensibleMark