AJAX设计策略(全).docVIP

AJAX设计策略(全) 内容 －概况 －什么是AJAX －AJAX技术 －AJAX和服务端技术 －设计策略 －设计策略1：自己完成（Do It Yourself） －设计策略2：使用客户端JavaScript库 －设计策略3：使用客户端框架 －设计策略4：包装 －设计策略5：远程调用 －设计策略6：所有Java技术 －其他信息 －关于作者 ? ? 概况 受网站目标的驱使，Web应用已经进入了一个新时代，这些目标包括更快的响应用户动作，在创作和分享web内容时进行的用户协作等。被定义为此类高速响应的和经常协作站点的最流行的术语就是Web 2.0。 ? ? ? ? 一些web 2.0的最经典的例子包括Google Maps 和 Flickr站点。Google Maps提供一个高速响应的用户界面（UI）。例如：你可以察看一副地图，并通过移动鼠标越过它以立即的察看相临近的区域。Flickr是这样一个网站，用户们存储和共享照片--用户管理几乎这个站点的所有内容。 另外的Web2.0站点通过一些方式提供相似的丰富的用户体验，这些方式包括整合其他网站的服务或合并一个稳定的新的信息流。例如，Google map服务可以被使用在另一个站点，比如一个汽车销售站点，用来显示一家销售指定汽车类型的代理商在地图上的位置。此类站点集成使用的术语叫做” mashups”。另外还包括一个运动导向网站，它可以不断的刷新分数而不需要用户请求页面更新。 这篇文章是关于现今用来制作高响应的web 2.0站点的主要技术：Asynchronous JavaScript and XML (AJAX). ? 什么是AJAX？ ? 许多优秀的文章都将AJAX描述为有效的，例如《Asynchronous JavaScript Technology and XML (AJAX) With Java 2 Platform Enterprise Edition》。简单说，AJAX是一系列使网页成为－或看起来像高速响应的技术。AJAX使这个成为可能，因为它支持网页的异步和部分刷新功能。 部分刷新意味着当一个交互事件发生－例如，用户向网页的表单里输入信息并且点击提交按钮－服务器处理信息并返回关于这些信息的有限响应。值得注意的，服务器并不返回整个页面，虽然返回整个页面已成为一种惯例，“点击，等待，刷新”web应用。相反的，客户端基于响应来更新页面。这意味着，只有部分页面被更新。换句话说，网页像一个模版一样被处理：客户端和服务端交换数据，客户端基于收到的数据来更新模版的某部分。可以这样认为，使用AJAX的web应用受事件和数据的驱动，而传统的web应用受页面驱动。 异步意味着在向服务端发送数据之后，当服务端在后台运行的时候，客户端可以继续执行。这意味这用户可以继续与客户端进行交互，而不必等待服务端的滞后响应。例如，用户可以继续在Google map上移动鼠标，并在显示器上看到一个平滑的，不间断的变换。客户端在继续执行之前不必等待服务端的响应。 AJAX站点的另一个重要方面在于，触发AJAX响应的事件不限于提交数据或点击链接。在页面的一个区域上移动鼠标，在输入域中键入数据，或者像Google Maps一样用鼠标拖拽地图，已足够触发AJAX响应。用户和网页间的动态交互使web应用更接近于高速响应的桌面应用。桌面应用经常被称为胖桌面应用（rich desktop applications）。所以web 2.0经常被叫做胖互联网应用（rich Internet applications）。 AJAX技术 下面的技术是AJAX里具有代表性的: 层叠样式单（CSS），一种定义页面表示样式的语言，例如字体、颜色等。 JavaScript，一种脚本语言。在JavaScript技术里对AJAX很关键的一个元素是XMLHttpRequest，一个用来在web客户端和web服务端交换数据的对象。 文档对象模型（DOM），提供页面的树状结构的逻辑视图。 ?XML，用来从服务端向客户端传送数据的一种格式。尽管如此，你可以使用其他格式，例如HTML, JavaScript Object Notation (JSON), 或无格式文本. ? 像其他web应用一样，AJAX web应用使用HTML，XHTML类的标记语言来呈现页面，或者JSP类服务端技术来生成网页。另外，服务端应用系统在AJAX应用中扮演一个关键的角色。类似Java EE的服务端应用系统包括对关于AJAX的数据验证，用户身份管理，和持久性配置的很好支持。请看本文的AJAX and Server-Side Java Technologies部分。 ? ? ? ? 图1: AJAX 如何处理用户动作 ? 1.??? 用户在客户端生成一个事件。这导致