第2章节Ajax新手上路002.docVIP

学习Ajax的第一步 2.1 Ajax的关键元素 Ajax不是单一的技术，而是四种技术的集合。表2-1简要介绍了这些技术，以及它们所扮演的角色。 表2-1 Ajax的关键元素 在第1章中我们看到了Ajax如何为用户提供了复杂的、运转良好的应用，改善了用户的交互体验。J avaScript就像胶水将各个部分粘合在一起，定义应用的工作流和业务逻辑。通过使用JavaScript操作D OM来改变和刷新用户界面，不断地重绘和重新组织显示给用户的数据，并且处理用户基于鼠标和键盘的交 互。CSS为应用提供了一致的外观，并且为以编程方式操作DOM提供了强大的捷径。XMLHttpRequest对象（或者类似的机制）则用来与服务器进行异步通信，在用户工作时提交用户的请求并获取必威体育精装版的数 据。图2-1显示了这些技术在Ajax中是如何配合的。 Ajax的四种技术之中，CSS、DOM和JavaScript这三个都不是新面孔，它们以前合在一起称作动态HTML， 或者简称DHTML。DHTML是在1997年因特网大跃进时代放的一颗“卫星”，它从来也没有实现过自己最初的承诺（在这个行业早已见怪不怪了[1]）。DHTML可以为Web页面创造新奇古怪的、交互性很强的界面，但是它永远也无法克服需要完全刷新整个页面的问题。问题在于，如果没有和服务器通信的能力，空有漂亮的界面，还是无法实现一些真正有意义的功能。Ajax除了大量使用DHTML，还可以发送异步请求，这大大延长了Web页面的寿命。通过与服务器进行异步通信，无需打断用户正在界面上执行的操作，Ajax与其前任DHTML相比，为用户带来了真正的价值。 更加方便的是，所有这些技术都已经预先安装在绝大多数的现代Web浏览器之中，包括微软公司的I E、Mozilla/Gecko系列的浏览器（例如Firefox、Mozilla Suite、Netscape Navigator和Camino）、Opera、苹果公司的Safari，以及它的近亲UNIX KDE桌面系统里的Konqueror。可惜的是，这些技术的实现细节在不同的浏览器之间，甚至在同一浏览器的不同版本之间存在着很多差异，这就是所谓的跨浏览器不兼容（cross-browser incompatibilities）问题。不过近5年来，这一状况得到了持续的改善，现在我们写代码时需要处理的此类问题已经非常少了。 所有现代的操作系统都会预先安装一个现代的浏览器。也就是说，这个星球上的绝大多数桌面电脑和笔记本电脑都已经为运行Ajax应用程序做好了准备。这正是大多数Java或.NET开发者所梦想的。（虽说在PDA和智能手机上也安装了浏览器，但是它们的功能通常已经被大幅裁减，无法支持Ajax所需的关键技术。即使它们能够支持这些技术，屏幕尺寸和输入方法方面的限制也是非常棘手的问题。因此就目前而言，Ajax主要是一种用于桌面电脑和笔记本电脑上的技术。） 我们的做法是先分别考察每一种技术，然后再去考察它们如何相互配合。如果你已经是一个Web开发 的老手，对这些技术已经烂熟于胸，那么可以直接跳到第3章，在那里我们将会考察如何使用设计模式来管理这些技术。 我们就从考察JavaScript来开始我们的探索之旅吧。 2.2 用JavaScript改善用户体验 JavaScript毫无疑问是Ajax工具箱中的核心技术。Ajax应用程序完全下载到客户端的内存中，由数据、表现和程序逻辑三者组成，JavaScript就是用来实现逻辑的工具。JavaScript是一种混合了多种编程思想的通用编程语言，提供了一个表面上与C系列语言相似的语法接口。 JavaScript可以简短地描述为一种弱类型的、解释型的和通用的脚本语言。弱类型（loosely typed）意味着变量不需要明确声明为字符串、整数或者对象，同一个变量可以使用不同的类型来赋值。例如，下面的代码是合法的： var x=3.1415926; x=pi; 变量x最初定义为一个数字类型的值，后来又赋给一个字符串类型的值。 解释型（interpreted）意味着不需要编译，源代码本身就可以直接执行。将源代码放在Web服务器上，通过因特网传输到用户的浏览器中，JavaScript应用的部署就完成了。此外，在JavaScript中，甚至还可以在运行时对一小段代码进行求值。 var x=eval(7*5); 在这里，我们将表达式定义为一段文本，而不是两个数字加一个算术操作符。使用这段文本来调用eval()， 将会解释文本中包含的JavaScript，并且返回表达式的值。在大多数场合，这样做执行效率不高；但是在 某些场合，这样做是很有用的，因为它可以带来很大的灵活性。 通用（general purpo