Ajax是asynchronous JavaScript and xml(异步JavaScript 和 xml)的缩写,是一套实现网页局部和服务器进行数据交互的技术标准,有很多的实现手段:可以手写,可以用框架(dwr),用Jquery等。
XMLHttpRequest对象
XMLHttpRequest是Ajax的基础(IE5和IE6 用ActivexObject),用于在后台和服务器进行数据交换,可以在不重新加载页面的情况下,对页面的局部进行数据更新。创建一个XMLHttpRequest对象:
var xmlhttp ; if(window.XMLHttpRequest){ xmlhttp = new XMLHttpRequest(); }else{ xmlhttp = new ActiveXObject("Microsoft.XMLHttp"); }为了保证浏览器的兼容性,需要检查浏览器是否支持XMLHttp。
XMLHttpRequest请求
创建好XMLHttpRequest对象后,如果需要将请求发送到服务器,就要用到XMLHttpRequest的open()和send()方法。
发送请求代码:
//get方法 xmlhttp.open("get","a.jsp",true); xmlhttp.send(); //post方法 xmlhttp.open("post",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xml.send("name=abao&pass=123");
open是初始化请求的参数,send发送请求,和服务器建立连接。
XMLHttpRequest响应
如果要得到服务器响应的信息就要用到XMLHttpRequest的responseText()和responseXML()方法。
属性 | 描述 |
responseText | 获得字符形式的响应数据 |
responseXML | 获得XML形式的响应数据 |
XMLHttpRequest readyState
当请求发送到服务器后,我们要执行一下基于响应状态的任务,readyState有请求的状态信息,每当readyState改变的时候都会触发onreadystatechange事件。下面是XMLHttpRequest的3个重要属性。
属性 | 描述 |
onreadystatechange | 函数名,每当readyState改变的时候都会调用该函数 |
readyState | 有XMLHttpRequest的状态信息,从0到4变化
|
status | 200:“OK”404:没有找到响应页面 |
xmlhttp.onreadystatechange=function{ if(xmlhttp.readyState==4&&xmlhttp.status==200){ Document.getElementById("xx").innerhtml=xmlhttp.responseText(); } }
一个示例:
其中要注意的东西:
- 1.responseText是XMLHttpRequest的一个属性,不是方法。
- 2.responseXML也是XMLHttpRequest的一个熟悉,不是方法,通常要解析。
- 3.HTML元素的innerHTML属性,好久没写生了。
- 4.判断浏览器是否支持XMLHttpRequest,是window.XMLHttpRequest
- 5.异步JavaScript通常会涉及到页面元素的改变,所以写ajax,对元素的操作要熟练。
手写的ajax程序好像只能向页面或者Servlet发送请求,对于一个J2ee工程,我们有时候会向一个javabean发送请求获得操作的结果
不知道手写的可不可以,希望高手指点。
未完待续。
附工程
版权声明:本文为博主原创文章,未经博主允许不得转载。