AJAX 简介及入门实例

2016-02-19 11:00 8 1 收藏

今天图老师小编给大家介绍下AJAX 简介及入门实例,平时喜欢AJAX 简介及入门实例的朋友赶紧收藏起来吧!记得点赞哦~

【 tulaoshi.com - Web开发 】

对于一个像我一样刚刚接触Web开发且无多少实际项目经验的新手而言,AJAX技术显得复杂而又深奥。经过两天的baidu、google,我对AJAX的基本原理有了一个大致的认识,在此总结一下。

1. 什么是AJAX?
AJAX全称是异步的JavaScript和XML,是Asynchronous JavaScript and XML的缩写。AJAX技术用于创建交互式网页应用的网站开发,至于何为异步,后文会有解释。

1.1 桌面应用程序和Web应用程序
在详细讨论AJAX技术之前,需要先知道AJAX技术究竟是用来做什么工作的。目前,编写应用程序总共有两种基本类型:

桌面应用程序 (Desktop Application)
Web应用程序 (Web Application)
桌面应用程序可以从互联网或者以CD方式获得,需要运行在桌面计算机上,例如我们常见的一些PC软件。Web应用程序与之不同,Web应用程序师运行在某处的Web服务器上的,因此需要通过Web浏览器去访问这样的应用程序。

不过,比这些应用程序的代码运行在何处更为重要的是,应用程序如何运转以及如何与其进行交互。桌面应用程序一般较快,并且拥有漂亮的用户界面和非凡的动态性,可以单击、选择、打开菜单和子菜单、到处巡游,基本不需要等待;另一方面,Web应用程序(比如Amazon.com 和eBay)提供了桌面程序不能实现的服务。然而,伴随着Web的强大而出现的是等待,等待服务器的响应,等待屏幕刷新,等待请求返回和生成新的界面。

AJAX的出现,就是为了缓解Web应用中与桌面应用相比中的等待这一问题。

1.2 AJAX - 老技术,新面孔
AJAX技术其实不是什么新技术,而是其他几种已存在技术的整合。

AJAX应用程序使用到以下基本技术:

使用HTML和CSS来建立Web表单并表示网页信息;
使用JavaScript来操作DOM(Document Object Model)来进行动态显示及交互;
使用XMLHttpRequest对象与Web服务器进行异步数据交换;
使用XML进行数据交换及相关操作;
使用JavaScript将所有东西绑定在一起。
我们来进一步分析这些技术的职责。目前我只要熟悉这些组件和技术就可以了。对这些代码越熟悉,就越容易从对这些技术的零散了解转变到真正把握这些技术(同时也真正打开了 Web 应用程序开发的大门)。

XMLHttpRequest对象

要了解的一个对象可能对您来说也是最陌生的,即 XMLHttpRequest。这是一个 JavaScript 对象,创建该对象很简单,如清单 1 所示。

清单 1. 创建新的 XMLHttpRequest 对象
代码如下:

script language="javascript" type="text/javascript"
!--
var xmlHttp = new XMLHttpRequest();
// --
/script

以后将进一步学习这个对象,现在要知道这是处理所有服务器通信的对象。继续阅读之前,先停下来想一想:通过 XMLHttpRequest 对象与服务器进行对话的是 JavaScript 技术。这不是一般的应用程序流,这恰恰是 Ajax 的强大功能的

来源:http://www.tulaoshi.com/n/20160219/1596303.html

延伸阅读
标签: Web开发
Ajax Ajax,异步JavaScript与XML,是使用客户端脚本与Web服务器交换数据的Web应用开发方法。这样,Web页面不用打断交互流程进行重新加裁,就可以动态地更新。 使用Ajax,你可以创建接近本地桌面应用的,直接的、高可用的、更丰富的、更动态的Web用户接口界面。 Ajax处理过程 一个Ajax交互从一个称为XMLHttpRequest的JavaScript对象开始...
标签: Web开发
我所举的这个例子是一个企业用户注册时的一个应用,当用户注册时检查用户名和企业名是否可用,以前的做法是在旁边加一个按钮,点击“检查”,就向服务器发出请求,然后等待……服务器返回信息,继续操作。如果我们用Ajax技术来实现以上的操作则不必等待服务器返回信息,用户输入用户名或企业名称的时候,当输入文本框失去焦点的时候,则会...
标签: Web开发
AJAX 可用来与 XML 文件进行交互式通信。 AJAX XML 实例 在下面的 AJAX 实例中,我们将演示如何通过使用 AJAX 技术,从 XML 文件中读取信息。 在下面的下列列表中选择一个 CD 在此列出 CD 信息。 AJAX 实例解释 上面的例子包含了一个简单的 HTML 表单,以及指向一段 JavaScript 的链接: htmlhead script src="selectcd.js"/sc...
标签: Web开发
与 responseText 以字符串返回 HTTP 响应不同,responseXML 以 XML 返回响应。 ResponseXML 属性返回 XML 文档对象,可使用 W3C DOM 节点树的方法和属性来检查和解析该对象。 AJAX ResponseXML 实例 在下面的 AJAX 实例中,我们将演示网页如何使用 AJAX 技术从数据库中读取信息。这次,这些从数据库中选取的数据将被转换为 XML 文档,...
标签: Web开发
到目前为之jQuery已经发布到1.4.2版本,而在这之前的一个星期他们刚发布1.4版本,看看他的各个版本的 发布时间 ,不难发现他的飞速发展,每个月都在更新版本;而且不断有人开发出新的 jQuery插件 ,最近又推出了 jQuery UI 库 jQuery于2006年一月十四号在BarCamp NYC (New York City)面世。主将 John Resig ,写有《Pro JavaScript Techniques...

经验教程

709

收藏

92
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部