论文导读：目前在Web应用开发中，Ajax无疑已经成为最能提高用户体验的一种技术。而它在技术方面的优点，如标准公开、跨浏览器和跨平台的兼容性、和Flex和Flash技术很好的集成等特点已经将Ajax推向了更广泛的应用。本文从实际开发的角度出发，解析了Ajax的基本原理。
关键词：AjaxWeb应用，用户体验
1 Ajax概述
Ajax是一种用于创建交互式Web应用的开发技术，它不是一种单一的技术，而是几种各自发展的一系列相关技术的有机结合。虽然在利用Ajax时，需要多种技术的支持。论文参考。但值得庆幸的是，您可能已经非常熟悉其中的大部分技术。
下面是Ajax应用程序所用到的基本技术：
n 使用XHTML与CSS的标准表现。
n 使用DOM(Document Object Model)进行动态显示与交互。
n 使用XML和XSLT进行数据交换与操作。
n 使用XMLHttpRequest进行异步数据传输。
n 使用JavaScript将所有这些绑在一起。
2 与传统的Web应用比较
传统的Web应用允许用户端填写表单（form），当送出表单时就向Web服务器发送一个请求。服务器接收并处理传来的表单，然后送回一个新的网页，但这个做法浪费了许多频宽，因为在前后两个页面中的大部分HTML码往往是相同的。由于每次应用的沟通都需要向服务器发送请求，应用的回应时间就依赖于服务器的回应时间。这导致了用户界面的回应比本机应用慢得多。
与此不同，AJAX应用可以仅向服务器发送并取回必需的数据，它使用SOAP或其它一些基于XML的页面服务接口（界面），并在客户端采用JavaScript处理来自服务器的回应，从而达到不用刷新页面就可以更新页面。因为在服务器和浏览器之间交换的数据大量减少（大约只有原来的5%），结果我们就能看到回应（服务器回应）更快的应用（结果）。同时很多的处理工作可以在发出请求的客户端机器上完成，所以Web服务器的处理时间也减少了。
3 Ajax相关技术
前文已经提到，Ajax包含了多种技术。对于大多数Web应用开发者而言，其中的一些技术已经相当熟悉。即便是不够熟悉，这些技术都很容易学习，并不像完整的编程语言那样困难。
3.1 JavaScript
JavaScript是一种轻型的通用解释性脚本语言，其核心已经嵌入目前主流的Web浏览器中。虽然大部分时候看到的JavaScript应用都是在网页中简单地调用页面内置对象和方法，但其实JavaScript是一种具有丰富的面向对象特性的程序设计语言，利用它能够执行许多复杂的任务。
Ajax应用是用JavaScript编写的，如果没有对JavaScript有足有多编程经验或理解，开发Ajax将困难重重。
3.2 CSS
CSS既Cascading Style Sheets（级联样式表）的缩写。论文参考。顾名思义，它是用来进行网页风格设计的。采用CSS对页面进行布局和修饰有以下几个特点。
1）表现和内容相分离
将设计部分剥离出来放在一个独立样式文件中，HTML文件中只存放文本信息。这样的页面对搜索引擎更加友好。
2）提高页面浏览速度
对于同一个页面视觉效果，采用CSS+DIV重构的页面容量要比TABLE编码的页面文件容量小得多，前者一般只有后者的1/2大小。浏览器就不用去编译大量冗长的标签。
3）易于维护和改版
只要简单的修改几个CSS文件就可以重新设计整个网站的页面。
3.3 XMLHttpRequest
在Ajax涉及到的技术中，“最新”并且对于未从接触过Ajax的开发者而言可能最陌生的术语就是XMLHttpRequest对象了。通过这个对象，Ajax可以像桌面应用程序一样只同服务器进行数据层面的交换。XMLHttpRequest对象与服务器交互通常都通过XML来实现，当然也可以是基于文本的其他形式。
XMLHttpRequest其实是一个JavaScript对象。在客户端，我们很容易就可以创建一个XMLHttpRequest对象。
3.4 DOM
DOM是Document Object Model文档对象模型的缩写。根据W3C DOM规范，DOM是一种与浏览器，平台，语言无关的接口，使得你可以访问页面其他的标准组件。简单理解，DOM解决了Netscape的Javascript和Microsoft的Jscript之间的冲突，给予web设计师和开发者一个标准的方法，让他们来访问他们站点中的数据、脚本和表现层对像。
DOM是以层次结构组织的节点或信息片断的集合。这个层次结构允许开发人员在树中导航寻找特定信息。分析该结构通常需要加载整个文档和构造层次结构，然后才能做任何工作。由于它是基于信息层次的，因而 DOM 被认为是基于树或基于对象的。
利用JavaScript操作DOM，Ajax应用就能够实时修改用户界面，例如有效地重绘页面的某一部分，或者修改表格的内容。
4 Ajax使用的场合
Ajax虽然可以实现无刷新更新页面内容，但是也不是什么地方都可以使用，它主要应用在交互较多、频繁读数据、数据分类良好的Web应用中。
4.1 适用场合
1）表单驱动的场合
使用Ajax，可以随时提交异步数据，并在页面上快速显示更新结果，而不需要刷新整个页面。
2）深层次的树的导航
深层次的级联菜单（树）的遍历是一项非常复杂的任务。使用JavaScript来控制显示逻辑，使用Ajax延迟加载更深层次的数据可以有效地减轻服务器的负担。
3）快速的用户与用户之间的交流响应
在众多人参与交流讨论的场合下，为了避免用户主动刷新页面以获取新的结果，Ajax是最好的选择。
4）类似投票无关痛痒的场合
对于类似这样的场合，如果提交过程较长，很多用户就会因为等待时间太长而不参与。但是利用Ajax可以把时间控制在很短的时间内，从而吸引更多的用户参与。
5）对数据进行过滤和操纵相关数据的场合
对数据使用过滤器，按照某一字段排序，开关过滤器等，任何要求具备很高交互性数据操纵的场合都应该使用JavaScript。在每次数据更新后，在对其进行查找和处理需要耗费较多的时间，而Ajax可以加速这个过程。
6）普通的文本输入提示和自动完成的场合
在文本框等输入表单中给予输入提示，或者自动完成，可以有效地改善用户体验。论文参考。尤其对于那些自动完成的数据可能来自于服务器端的场合，Ajax是很好的选择。
2.不适用场合
1）部分简单的表单
虽然表单提交可以从Ajax获取最大的一处，但太多简单的表单极少能从Ajax得到明显改善。
2）搜索
有些使用了Ajax的搜索引擎不允许使用浏览器的后退按钮来查看前一次的搜索结果，这对已经养成搜索习惯的用户来说是不可原谅的。
3）替换大量的文本
使用Ajax可以实现页面的局部刷新，但是如果页面的每个部分都改变了，重新请求服务器要更加合理一些。
4）对呈现的操纵
Ajax看起来是纯粹的UI技术，但事实上不是。对于可维护的干净的Web应用，不使用Ajax来控制页面呈现是一个不错的主意。JavaScript可以很简单地处理XHTML/HTML/DOM，使用CSS就可以很好的表达数据显示。
5 结论
与其说Ajax是一种技术，不如说它是一种技巧，一种融合成熟技术的技巧。虽然它的应用日益广泛，但却存在着一些缺点，如浏览器无法后退、存在安全隐患、对搜索引擎支持不足等。因此，如何合理地利用Ajax也是我们需要讨论的议题。
参考文献
[1]刘晓华.JSP应用开发详解[M].北京:电子工业出版社,2007.
[2]陈营辉,赵海波.PHP+Ajax完全自学手册[M].北京:机械工业出版社2009.
|
