Ajax 入门Demo

 
  
  
  
  
  


 
 
	测试
	

 

 

js代码：

var xmlHttp = false;
try {
  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
  try {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	
  } catch (e2) {
    xmlHttp = false;
  }
}

if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
  xmlHttp = new XMLHttpRequest();
}

function callServer() {
  // Build the URL to connect to
  //var url = "/scripts/getZipCode.php?city=" + escape(city) + "&state=" + escape(state);
  var url="test.html";
  // 连接到服务url
  xmlHttp.open("GET", url, true);
  // 设置回调方法
  xmlHttp.onreadystatechange = updatePage;
  // Send the request
  xmlHttp.send(null);
}
//回调方法
function updatePage() {
	//如果解析已经完成
  if (xmlHttp.readyState == 4) {
    var response = xmlHttp.responseText;
    document.getElementById("show").innerText = response;
  }
}

 

 readyState的五种状态

 

(0)未初始化
 此阶段确认XMLHttpRequest对象是否创建，并为调用open()方法进行未初始化作好准备。值为0表示对象已经存在，否则浏览器会报错－－对象不存在。
 
(1)载入
 此阶段对XMLHttpRequest对象进行初始化，即调用open()方法，根据参数(method,url,true)完成对象状态的设置。并调用send()方法开始向服务端发送请求。值为1表示正在向服务端发送请求。
 
(2)载入完成
 此阶段接收服务器端的响应数据。但获得的还只是服务端响应的原始数据，并不能直接在客户端使用。值为2表示已经接收完全部响应数据。并为下一阶段对数据解析作好准备。
 
(3)交互
 此阶段解析接收到的服务器端响应数据。即根据服务器端响应头部返回的MIME类型把数据转换成能通过responseBody、responseText或responseXML属性存取的格式，为在客户端调用作好准备。状态3表示正在解析数据。
 
(4)完成
 此阶段确认全部数据都已经解析为客户端可用的格式，解析已经完成。值为4表示数据解析完毕，可以通过XMLHttpRequest对象的相应属性取得数据。