如果要问做什么事是最有吸引力,那就是创建Web应用。毕竟,上次你听到有人称赞某产品的交互设计是什么时候的事了?(除了iPod之外) 它们都很cool, 而且都是很创新的项目。
抛开这些不管,Web设计者们对设计交互式的Web没有什么更好的办法,却对我们做桌面软件的同事投去少许羡慕的目光.桌面应用程序有丰富的界面以及对于Web程序来说无法比拟的响应能力。同样,Web的快速发展,在我们所提供的体验和用户从桌面应用程序所得到的体验间产生巨大的差距
而如今差距正在消失。请看看“Google建议(Google Suggest)”. 观察它按你的输入显示建议条目的更新速度,几乎是立即更新的。再看看"Google Maps". 放大,用你的鼠标搬动和滚动。这些动作几乎是立即响应的,不用等待页面刷新。
"Google Suggest"和"Google Maps" 是采用Ajax技术的两个典型例子。Ajax是Asynchronous JavaScript and XML的简称,它表现出一个Web开发上的根本转变,那就是,Web上可能做些什么.
Ajax的定义
Ajax不是一个技术,它实际上是几种技术,每种技术都有其独特这处,合在一起就成了一个功能强大的新技术。Ajax包括:
* XHTML和CSS
* 使用文档对象模型(Document Object Model)作动态显示和交互
* 使用XML和XSLT做数据交互和操作
* 使用XMLHttpRequest进行异步数据接收
* 使用JavaScript将它们绑定在一起
传统的web应用模型工作起来就象这样:大部分界面上的用户动作触发一个连接到Web服务器的HTTP 请求。服务器完成一些处理---接收数据,处理计算,再访问其它的数据库系统,最后返回一个HTML页面到客户端。这是一个老套的模式,自采用超文本作为 web使用以来,一直都这样用, 但看过《The Elements of User Experience》的读者一定知道,是什么限制了Web界面没有桌面软件那么好用。
图1: 传统Web应用模型(左)与Ajax模型的比较(右).
这种旧的途径让我们认识到了许多技术,但它不会产生很好的用户体验。当服务器正在处理自己的事情的时候,用户在做什么?没错,等待。每一个动作,用户都要等待。
很明显,如果我们按桌面程序的思维设计Web应用,我们不愿意让用户总是等待。当界面加载后,为什么还要让用户每次再花一半的时间从服务取数据?实际上,为什么老是让用户看到程序去服务器取数据呢?
Ajax如何不同凡响
通过在用户和服务器之间引入一个Ajax引擎,可以消除Web的开始-停止-开始-停止这样的交互过程. 它就像增加了一层机制到程序中,使它响应更灵敏,而它的确做到了这一点。
不像加载一个页面一样,在会话的开始,浏览器加载了一个Ajax引擎---采用JavaScript编写并且通常在一个隐藏frame中。这个引擎负责绘制用户界面以及与服务器端通讯。Ajax引擎允许用异步的方式实现用户与程序的交互--不用等待服务器的通讯。所以用户再不不用打开一个空白窗口,看到等待光标不断的转,等待服务器完成后再响应。
图 2: 传统Web应用的同步交互过程(上)和Ajax应用的异步交互过程的比较(下).
通常要产生一个HTTP请求的用户动作现在通过JavaScript调用Ajax引擎来代替. 任何用户动作的响应不再要求直接传到服务器---例如简单的数据校验,内存中的数据编辑,甚至一些页面导航---引擎自己就可以处理它. 如果引擎需要从服务器取数据来响应用户动作---假设它提交需要处理的数据,载入另外的界面代码,或者接收新的数据---引擎让这些工作异步进行,通常使用XML, 不用再担误用户界面的交互。
谁在使用Ajax
在采用Ajax的开发上面,Google做了巨大的投资。去年Google所有主要的产品都用了这项技术---Orkut, Gmail, 以及最近的beta版的Google Groups, Google Suggest和Google Maps---它们全是Ajax的应用。(要想了解更多这些Ajax实际的技术细节,请看它们的分析文章:Gmail, Google Suggest, Google Maps). 其它的像:Flickr, 采用许多人们喜欢的Ajax特性, 还有Amazon的A9.com搜索引擎也采用类似的技术。
这些项目证明了Ajax不只是学术上的,也有许多真实世界成功应用。这不是什么实验室里的技术。Ajax的应用可大可小,从非常简单的,像单一功能的Google Suggest到非常复杂的Google Maps.
from: http://www.360doc.com/showWeb/0/0/9837.aspx
分享到:
相关推荐
Ajax-ajax-contact-form-wordpress.zip,wordpress的联系人表单,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新加载...
在"ASP.NET AJAX 入门实例"中,我们将探讨如何使用C#语言和ASP.NET框架来实现AJAX功能。C#是.NET Framework的主要编程语言,而ASP.NET是一个用于构建Web应用程序的框架,它支持AJAX功能,可以方便地在服务器端处理...
Ajax-wc-ajax-product-filter.zip,Woomerce AJAX产品过滤器-是一个插件,允许您根据类别、属性和价格轻松过滤产品。您可以对产品进行排序,导航到下一页和上一页,而无需重新加载该页。,ajax代表异步javascript和xml...
简单的介绍一下,DOM常用API的属性和方法
【标题】"jboss-ajax4jsf-1.1.1-src" 是一个开源项目,主要涉及Ajax4jsf框架的源代码版本,版本号为1.1.1。Ajax4jsf是针对JavaServer Faces (JSF) 技术的一个扩展,它允许开发者在JSF应用中无缝集成Ajax功能,提升...
Ajax-bootstrap-select-ajax.zip,bootstrap select对数据源的ajax支持,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新...
Ajax-gunbasic-js.zip,gunbasic js是一个库,用于快速开发基于ajax的web应用程序,这些应用程序易于独立测试。编写ajax代码只需要一行客户端js和服务器中的实现。适用于快速成型和团队开发。,ajax代表异步javascript...
**走进 AJAX** AJAX,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种创建高效、互动网页应用的技术,允许网页在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。AJAX的核心思想...
Ajax-ajax-shopping-cart-page.zip,magento 2购物车页面ajax更新数量,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新...
包含的“dynatrace-AJAX-edition-4.2.0.1528.msi”是Windows Installer文件,用于在Windows操作系统上安装Dynatrace AJAX Edition。安装过程通常包括接受许可协议、选择安装路径、配置初始设置等步骤。安装完成后,...
Ajax-ajax-blob-downloader.zip,从ajax请求下载blob,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页,其中网页的小部分在不重新加载网页的情况下...
Ajax-ajax-todo-list.zip,客户端渲染SPA(单页应用程序)实践。这个项目使用ajax来发送请求,node.js来处理api。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它...
Ajax-Magento-ajax-add-to-cart.zip,[模块magento 1]magento ajax添加到购物车-ajoter vos produits au panier en ajax/感谢ajax将您的产品添加到购物车,ajax代表异步javascript和xml。它是多种web技术的集合,包括...
Ajax-ajax-ex-boolflix.zip,副本di netflix、con js、html和css、con utilizzo di handlebars、fontawesome和chiamate ajax,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和...
Ajax-ajax-live-search.zip,ajax live search是一个php搜索表单,类似于google autocomplete特性,在您输入结果时显示结果。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和...
Ajax-magento2-ajax-layered-navigation.zip,ajax分层导航magento 2提供了一个过滤器列表,帮助您的客户以最短的方式搜索和获得他们最喜欢的产品。这个扩展应用了现代ajax技术来增强过滤系统,以提高用户对页面上每...
Ajax-Codeigniter-3-Ajax-Form-Submission.zip,“codeigniter 3 ajax表单提交和验证教程”一集的源代码,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建...
Ajax-magento2-ajax-cart-quick.zip,magento 2 ajax购物车扩展插件提供舒适的购物体验。客户可以很容易地选择可配置的选项并在弹出窗口中编辑项目,而不会浪费重新加载页面的时间。,ajax代表异步javascript和xml。它...
### AJAX技术概述与应用 #### 一、引言 AJAX(Asynchronous JavaScript and XML)是一种用于构建交互式Web应用程序的技术。它通过在后台与服务器进行异步数据交换,使得Web页面无需重新加载整个页面即可更新部分...