/*
* 使用AJAX和服务器的通信
*
* * 创建XmlHttpRequest对象
*
* * 打开和服务器的连接
*
* * 发送请求
*
* * 处理服务器的返回信息
*
*/
/**
* 该函数创建XmlHttpRequest对象
*/
function ajaxFunction(){
var xmlHttp;
try{ // Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e){
try{// Internet Explorer
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){}
}
}
return xmlHttp;
}
//<input type="button" name="ok" id="ok" value="测试服务器连接">
window.onload=function(){
document.getElementById("ok").onclick=function(){
//1 创建XmlHttpRequest对象
var xmlRequest=ajaxFunction();
//2 处理服务器的返回信息(接受服务器端时时返回的信息)
/*
* onreadystatechange .相当于..onclick=function(){}
*
* onreadystatechange :服务器端状态该变的事件
* 每次 readyState 属性的改变(0,1,2,3,4)都会触发 readystatechange事件
* 如果把 onreadystatechange 事件处理函数赋给一个函数，那么每次 readyState 值的改变都会引发该函数的执行
*/
xmlRequest.onreadystatechange=function(){
//alert(xmlRequest.readyState);
//alert(xmlRequest.status);
//响应发送完毕
if(xmlRequest.readyState==4){
//200 一切正常(ok) 304 没有被修改(not modified)(服务器返回304状态，表示源文件没有被修改 )
if(xmlRequest.status==200||xmlRequest.status==304){
alert(" 服务器处理完毕");
}
}
}
/*
* 3 打开和服务器的连接
* open(method, url, asynch)
* * method:请求方法 get post
* * url:路径字符串，指向你所请求的服务器上的那个文件。可以是绝对路径或相对路径。
* * asynch：表示请求是否要异步传输，默认值为true(异步)。指定true
* * 在路径单独后面加上时间戳，保证每次请求的路径不一样,此时,浏览器会认为是一次新的请求
*/
alert(new Date().getTime());
xmlRequest.open("get","../testServlet01?timeStamp="+new Date().getTime(),true);
/*
* 4 发送请求
* * 若选用的是 GET 请求，则不会发送任何数据， 给 send 方法传递 null 即可
* * 即使传值,服务器也获取不到 "b=9$c=23"
*/
xmlRequest.send(null);
}
}