ajax详解

来源:互联网 发布:mac如何剪辑音频 编辑:程序博客网 时间:2024/06/14 11:15

Ajax就是异步的JavaScript和XML。


(1)创建XMLHttpRequest对象

var xmlhttp;if (window.XMLHttpRequest)  {// code for IE7+, Firefox, Chrome, Opera, Safari  xmlhttp=new XMLHttpRequest();  }else  {// code for IE6, IE5  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

(2)向服务器发送请求

xmlhttp.open("GET","test1.txt",true);xmlhttp.send();


异步 - True 或 False?

AJAX 指的是异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。

XMLHttpRequest 对象如果要用于 AJAX 的话,其 open() 方法的 async 参数必须设置为 true:


(3)服务器响应

使用responseText或responseXML属性。


responseText属性返回字符串形式的响应,因此可以这样使用:

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;


如果来自服务器的响应是 XML,而且需要作为 XML 对象进行解析,使用responseXML属性

xmlDoc=xmlhttp.responseXML;txt="";x=xmlDoc.getElementsByTagName("ARTIST");for (i=0;i<x.length;i++)  {  txt=txt + x[i].childNodes[0].nodeValue + "<br />";  }document.getElementById("myDiv").innerHTML=txt;


onreadystatechange 事件

当请求被发送到服务器时,我们需要执行一些基于响应的任务。

每当 readyState 改变时,就会触发 onreadystatechange 事件。

readyState 属性存有 XMLHttpRequest 的状态信息。

下面是 XMLHttpRequest 对象的三个重要的属性:

(1)onreadystatechange:存储函数,每当readyState属性改变时,就会调用该函数

(2)readyState:

0:请求未被初始化

1:服务器链接已建立

2:请求已接收

3:请求处理中

4:请求已完成,且响应已就绪

(3)status:

200:‘ok’

404:未找到页面



当 readyState 等于 4 且状态为 200 时,表示响应已就绪:

xmlhttp.onreadystatechange=function()  {  if (xmlhttp.readyState==4 && xmlhttp.status==200)    {    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;    }  }
注释: onreadystatechange 事件被触发 5 次(0 - 4),对应着 readyState 的每个变化。







0 0
原创粉丝点击