AJAX入门

简介

Ajax(Asynchronous JavaScript And XML)异步JavaScript和可扩展标记语言

AJAX是一种运用JavaScript和可扩展标记语言(XML)，在网络浏览器和服务器之间传送或接受数据的技术。

 

Ajax 由 HTML、JavaScript 技术、DHTML 和 DOM 组成

1、HTML 用于建立 Web 表单并确定应用程序其他部分使用的字段。

2、JavaScript 代码是运行 Ajax 应用程序的核心代码，帮助改进与服务器应用程序的通信。

3、DHTML 或 Dynamic HTML，用于动态更新表单。我们将使用 div、span 和其他动态 HTML

元素来标记 HTML。

4、文档对象模型 DOM 用于（通过 JavaScript 代码）处理 HTML 结构和（某些情况下）服务器返回的 XML。

 

Ajax与传统 WEB比较

l         传统web应用

      □  页面的完全刷新

      □   简单操作也导致页面重新加载全部数据

l         Ajax

      □  部分刷新

      □  只做必要的数据交换

      □  异步访问服务器端

 

Ajax  XMLHttpRequest 对象

异步请求对象，它最大的用处是可以更新网页的部分内容而不需要刷新整个页面。

 

 

 

实现异步请求的步骤：

 

(1)创建异步请求对象

 

	//创建XMLHttpRequest对象       
    function createXMLHttpRequest() {
		if(window.XMLHttpRequest) { //Mozilla 浏览器、FireFox、Opera等浏览器支持的创建方式
			XMLHttpReq = new XMLHttpRequest();
		}
		else if (window.ActiveXObject) { // IE浏览器
			try {
				XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				try {
					XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
				} catch (e) {}
			}
		}
	}

 

 

(2)设置回调函数：

 

xmlHttp.onreadystatechange=函数名

 

 

 

 

(3)创建一个新的http请求，并指定此请求的方法、URL以及验证信息

 

 

 

xmlHttp.open(请求方式, url地址, 是否立即返回, 用户名, 密码);

 

 

 

(4)发送请求到http服务器并接收回应

xmlHttp.send(null);

*此方法的同步或异步方式取决于open方法中的参数，如果为false，此方法将会等待请求完成或者超时时才会返回，如果为true，此方法将立即返回。

 

 

(5)根据返回XMLHTTP请求的当前状态(当xmlHttp.readyState==4&&xmlHttp.status==200时表

示数据接收完毕)。

 

 

 

(6) 处理返回数据，完毕。

 

返回数据处理方式

<1>  responseText 将响应信息作为字符串返回

如:div_id.innerHTML=xmlHttp.responseText

 

<2>  responseXML 将响应信息格式化为XMLDOM对象并返回，返回数据以XML文档的形式，

需要用XMLDOM方式来解析(见：XMLDOM相关API文档)

         注意:发送回来的数据需求设置内容类型:

         response.setContentType ("text/xml; charset=UTF-8");

 

<3>  responseBody 将响应信息以unsigned byte数组的形式返回

 

<4>  responseStream 将响应信息以IStream对象的形式返回

 

 

 

 

 

 <请参考示例代码>

 

  示例演示说明：

  <1>添加struts1.2 jar 包

  <2>把person.sql文件导入到mysql数据库

  <3>修改数据库连接类：DBManager.java 文件中（数据库名、用户名、密码）是否与本机上的一致

 

 

 

评论

1 楼 greatverve 2009-07-17  

正在转向j2ee,先看完你的博客。