Ajax技术是目前在浏览器中通过JavaScript脚本可以使用的所有技术的集合。Ajax并没有创造出某种具体的新技术,它所使用的大多数技术都是在很多年以前就已经存在了,然而Ajax以一种崭新的方式来使用所有的这些技术,使得古老的B/S方式的Web开发焕发了新的活力,迎来了第二个春天。

具体来说,Ajax基于下列这些核心技术:

XHTML:对应W3C的XHTML规范,目前是XHTML1.0。
CSS:对应W3C的CSS规范,目前是CSS2.0。
DOM:这里的DOM主要是指HTML DOM,XML DOM包括在下面的XML中。
JavaScript:对应于ECMA的ECMAScript规范
XML:对应W3C的XML DOM、XSLT、XPath等规范。
XMLHttpRequest:对应WhatWG的Web Applications1.0规范(-apps/current-work/)的一部分

可以看出,除了XMLHttpRequest以外,所有的技术都是目前已经广泛使用,得到了广泛理解的基于Web标准的技术。而
XMLHttpRequest虽然尚未被W3C采纳,其实已经是一个事实上的标准了。几乎所有主流的浏览器,例如IE、Firefox、
Netscape、Opera、Safari全部都支持这个技术。所以Ajax就是目前做Web开发最符合标准的技术。上述的所有技术都已经可以在浏览器
中使用,因此用户不需要安装任何额外的软件(只需要有一个浏览器,例如IE),就可以运行任何符合标准的Ajax应用。这对于Ajax技术的普及、降低
Ajax应用部署和维护的成本是非常重要的。

此外,随着浏览器的发展,更多的技术还会被添加进Ajax的技术体系之中。例如,目前Firefox浏览器的最新版本已经可以直接支持矢量图形格式
SVG。Firefox已经可以支持JavaScript 2.0(对应ECMAScript
4.0规范)中的E4X(JavaScript的XML扩展)。Firefox、Opera、和Safari浏览器还可以支持Canvas(也是Web
Applications1.0规范的一部分),网上已经有人开发出了使用Canvas技术制作的3D射击游戏的演示。但是因为这些技术目前还没有得到市
场占有率最高的IE浏览器的支持,目前只能被应用在一些有限的场合(例如,在企业/机关内部,可以要求用户只使用Firefox浏览器)。

在上述的这些Ajax的核心技术中,最核心的技术就是XMLHttpRequest。它最初的名称叫做XMLHTTP,是微软公司为了满足Web开发

者的需要,1999年在IE5.0浏览器中率先推出的。后来这个技术被上述的规范命名为XMLHttpRequest。它正是Ajax技术所以与众不同的
地方。简而言之,XMLHttpRequest为运行在浏览器中的JavaScript脚本提供了一种在页面之内与服务器通信的手段。页面内的
JavaScript可以在不刷新页面的情况下从服务器获取数据,或者向服务器提交数据。而在这个技术出现之前,浏览器向服务器提交数据只能通过HTML
表单的提交,从服务器获取数据只能通过点击一个超链接,这些操作一般都会带来一次全页面的刷新。

XMLHttpRequest的出现为Web开发提供了一种全新的可能性,甚至整个改变了人们对于Web应用由什么来组成的看法。在这个技术出现之

前,由于技术上的限制,人们认为Web应用就是由一系列连续切换的页面组成的。因此整个Web应用被划分成了大量的页面,其中大部分是一些很小的页面。用

户大部分的交互都需要切换并且刷新整个页面,而在这个过程中(下一个页面完全显示出来之前),用户只能呆呆地等着,什么事都做不了。这就是我们所习以为常
的Web应用,在10年以前就是这个样子。然而XMLHttpRequest技术的出现使得我们终于可以打破这种笨拙的开发模式,以一种全新的方式来做

Web开发,为用户提供更好的交互体验。大量的探索者(自豪的说,也包括笔者在内)以XMLHttpRequest技术为基础,将一些古老的Web技术重
新包装整合。经过了多年的不懈努力,终于在2005年开花结果。在这一年的2月,出现了一个新的术语Ajax,来描述这样一类的技术和开发方式。

与传统的Web开发不同,Ajax并不是以一种基于静态页面的方式来看待Web应用的。从Ajax的角度看来,Web应用仅由少量的页面组成,其中每
个页面其实是一个更小型的Ajax应用。而一些简单的Ajax应用,例如一个简单的RSS阅读器,甚至只有一个页面。每个页面上面都包括有一些使用
JavaScript开发的Ajax组件。这些组件使用XMLHttpRequest对象以异步的方式(就是不需要打断用户操作的后台方式)与服务器通
信,从服务器获取需要的数据后,使用DOM API来更新页面中的一部分内容。因此Ajax应用与传统的Web应用的区别主要在3个地方:

1. 不刷新整个页面,在页面内与服务器通信。
2. 使用异步方式与服务器通信,不需要打断用户的操作,具有更加迅速的的响应能力。
3. 应用仅由少量页面组成。大部分交互在页面之内完成,不需要切换整个页面。

由此可见,Ajax使得Web应用更加动态,带来了更高的智能,并且提供了表现能力丰富的Ajax UI组件。这样一类新型的Web应用叫做RIA(Rich Internet Application)应用。除了Ajax,还包括有Flash等等技术。

与1990年代末的DHTML相比,Ajax更加强调符合真正的Web标准的开发方式。Ajax对于现有的基于Web标准的技术的利用程度比
DHTML高出了很多。而DHTML当初昙花一现,随后声名狼藉,最终彻底失败的最大原因就在于其开发者大多不重视基于真正的Web标准来做开发。

DHTML其实是浏览器大战的时代微软和Netscape为了吸引眼球而制造的一个名词,并没有得到W3C的认可。并且经常被开发人员滥用,制造出一

大堆不符合真正的Web标准的JavaScript脚本和HTML标记,常常只能运行在某种特定的浏览器中(主要是IE)。DHTML总是过于注重各种花

哨的视觉效果,而Ajax所最为关注的问题则是真正改善Web应用可用性,这正是Ajax技术诞生的使命,甚至也正是JavaScript脚本语言诞生的
使命。

跨浏览器自然是Web应用可用性的重要组成部分,只有基于真正的Web标准来做开发,才有可能跨浏览器为用户提供一致的交互体验。而跨浏览器仅仅是基

于真正的Web标准做开发的一个原因。另一个原因是,唯有这样,才能建造出向后兼容的Web应用。向后兼容的意思就是我们今天建造的Web应用,当明天用
户都使用浏览器的新版本(例如IE
7.0)之后,不必做任何修改就能够直接运行在这些新版本上。这样可以降低Web应用的维护成本,并且对于改善可用性、使用户获得更好的交互体验也会很有
帮助。做过多年Web开发的开发者都知道,以前专门为IE 5.0开发的Web应用,不加以修改和重新测试就运行在IE
6.0上是很困难的。在这里就是没有做到向后兼容,Ajax技术会使得这些问题都不再存在。此外,基于真正的Web标准做开发,才能充分地利用Web标准
发展的各项成果(例如上述的SVG、E4X等符合标准的技术),利用最先进的技术为用户提供更好的交互体验。

Ajax技术的背后有两个推动力:Web标准的成熟、软件可用性和交互设计理论的成熟。在软件的可用性方面,除了一些通用的可用性和交互设计理论之外
(这方面的经典著作包括《About Face 2.0》中文版、《面向使用的软件设计》等等),Web应用的可用性(Web
usability)也是国外非常热门的一个研究领域,主要侧重于研究如何提高Web网站的可用性。美国在这个领域有着非常深入的研究,并且对于一些公共

机构网站的可用性还有相关的法律条款来约束(Section508,508条款,于2001年6月21日成为美国的法律,直接影响了联邦部门和一些代理机

构,还有为他们服务的网页设计师。这条法律也适用于政府投资项目和任何采用了该法律的州)。对于这些网站,如果无法达到条款上的一些可用性要求,网站经营
者就违法了。如果是开发公司无法达到这些要求,就别指望从联邦政府手中拿到这些项目。

为了对如何提高Web应用的可用性做出指导,W3C在20世纪90年代建立了Web Accessibility Initiative(WAI),致力于为网站建造者提供实现可访问性(与可用性同义)的方法和策略()

Web可用性方面的经典著作包括《网站重构》。

综上所述,可以认为Ajax就是Web标准和Web应用的可用性理论的集大成者。它极大地改善了Web应用的可用性和用户的交互体验,最终得到了用户和市场的广泛认可。所以可以说,Ajax就是用户和市场的选择。

目前Ajax已经成为了Web应用的主流开发技术,大量的业界巨头已经采纳并且在大力推动这个技术的发展。最近的动态包括:

1. IBM、Oracle、Yahoo!、BEA、RedHat、Novell等页界领先的公司启动了Open Ajax项目。致力于为Ajax开发建造先进强大的的开发工具。

IBM在2月底已经发布了Open Ajax项目的Ajax Toolkit Framework(ATF)1.0,是一个基于Eclipse IDE的Ajax开发工具。

2. 微软开发了自己的Ajax框架Altas,不过主要是和服务器端他们自己的ASP.NET框架配合工作。

3. Sun虽然行动迟缓,但是也将Ajax技术列入了J2EE的blueprint(蓝图)中,作为J2EE技术的有益的补充。

除了上述这些公司之外,Google公司不可不提,因为正是他们率先采用Ajax技术建造出了一大堆非常出色的应用,才将Ajax技术引到了聚光灯下。Google公司建造的Ajax应用包括Google
Maps、GMail、Google Suggest等等,其中公认最优秀最复杂的Ajax应用是Google
Maps。由于完全基于Ajax技术来建造Google Maps的界面,Google
Maps提供了远远超越其竞争对手的地图服务的交互体验。如果说Google后台的地图技术并不存在巨大优势的话,那么Ajax技术和优秀的交互设计成为了他们压倒竞争对手的最后一根稻草。最终使得Google
Maps脱颖而出,获得了用户的青睐。

我们可以对比一下微软前后的两个地图服务就可以看出差别。

微软公司所提供的旧的地图服务:。是传统Web应用的代表,性能很差而且极其难用。

微软公司所推出了新的地图服务:。新的地图服务包括这个网站上的很多其他服务完全基于Ajax技术来建造,获得了极好的可用性。这个新的地图服务可以看作是在Google推出了Google
Maps服务之后,微软公司痛定思痛的产物,在很多地方模仿了Google Maps。

Ajax的典型应用除了Google Maps,还有微软的Windows Live、Yahoo!的Flickr等等。此外国内新浪的blog也使用了一些Ajax的技术。

你真正的了解Ajax?Ajax技术简述的更多相关文章

  1. 关于Ajax的技术组成与核心原理

    1.Ajax 特点: 局部刷新.提高用户的体验度,数据从服务器商加载 2.AJax的技术组成 不是新技术,而是之前技术的整合 Ajax: Asynchronous Javascript And Xml ...

  2. Web前端-Ajax基础技术(下)

    Web前端-Ajax基础技术(下) 你要明白ajax是什么,怎么使用? ajax,web程序是将信息放入公共的服务器,让所有网络用户可以通过浏览器进行访问. 浏览器发送请求,获取服务器的数据: 地址栏 ...

  3. Web前端-Ajax基础技术(上)

    Web前端-Ajax基础技术(上) ajax是浏览器提供一套的api,用于向服务器发出请求,接受服务端返回的响应,通过javascript调用,实现通过代码控制请求与响应,实现网络编程. ajax发送 ...

  4. Java进阶知识01 Struts2下的 jquery+ajax+struts 技术实现异步刷新功能

    1.效果图示 横线上方的部分不动(没有刷新),下方实现刷新(异步刷新) 2.实现步骤 jquery+ajax+struts技术实现异步刷新功能的步骤:    1.需要用到 jquery+ajax+st ...

  5. AJAX—AJAX基础

    AJAX简介 什么是AJAX AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”.即使用Javascript语言与服务器进行异 ...

  6. ajax请求技术

    1.写在前面: 阅读要求: 具有一定的HTML.CSS.JavaScript.Json基础 2.什么是ajax Ajax:即”Asynchronous Javascript And XML”(异步Ja ...

  7. Ajax编程技术

    AJAX:”Asynchronous JavaScript and XML” 中文意思:异步JavaScript和XML. 指一种创建交互式网页应用的网页开发技术. 不是指一种单一的技术,而是有机地利 ...

  8. AJAX背景技术介绍

    AJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. 主要包含了以下几种技术: Ajax(A ...

  9. AJAX开发技术

    AJAX技术 AJAX(Asynchronous JavaScript and XML,异步JavaScript和XML),AJAX并不是一项新的技术,它产生的主要目的是用于页面的局部刷新,从之前的代 ...

随机推荐

  1. 为Angular-UEditor增加工具栏属性

    感谢胡大大分享的的开源项目 Angular 的 UEditor 插件 Angular-UEditor 本文只是修改了angular-ueditor.js,加入了对工具栏的定制,方便项目使用 1 (fu ...

  2. ID选择器

    在很多方面,ID选择器都类似于类选择符,但也有一些重要的区别: 1.为标签设置id="ID名称",而不是class="类名称". 2.ID选择符的前面是井号(# ...

  3. JS获取屏幕各种高

    <script language="javascript"> var h = ""; h += " 网页可见区域宽:"+ doc ...

  4. PS2251-07 海力士(金士顿U盘量产,成功!)

    U盘挂掉了,用芯片无忧测到是这个样子的,看到是PS2251-07 海力士的 网上找了很多方法都不成功,最后找到了两个可以量产成功的方法,建议使用第一种. 首先,附上三个检测工具 芯片无忧.GetInf ...

  5. 371. Sum of Two Integers -- Avota

    问题描述: Calculate the sum of two integers a and b, but you are not allowed to use the operator + and - ...

  6. 【HOJ2430】【贪心+树状数组】 Counting the algorithms

    As most of the ACMers, wy's next target is algorithms, too. wy is clever, so he can learn most of th ...

  7. python everything is object

    python面向对象非常彻底,即使过程式的代码风格,python在运作的时候也是面向对象的.everything is object. 差异 在面向对象的理念上,python和非常工程化的面向对象语言 ...

  8. coffee 编译时, 用本地环境

    export PATH="./node_modules/.bin:$PATH" 原文: How to use package installed locally in node_m ...

  9. input+div 下拉选择框

    前台html页面 <html> <head> <meta name="viewport" content="width=device-wid ...

  10. Javascript中的函数(Function)与对象(Object)的关系

    今天我们来尝试理解Function和Object.因为这个里面有些人前期可能会搞糊涂.他们之间到底是什么关系.当然也不除外当初的我. 注意:官方定义: 在Javascript中,每一个函数实际上都是一 ...