1.创建XMLHttpRequest对象
var xmlHttp=createXMLHttpRequest();
function createXMLHttpRequest()
{
var xmlHttp;
if(Window.XMLHttpRequest)
{
//IE6以上版本和其他浏览器内置XMLHttpRequest对象
xmlHttp=new XMLHttpRequest();
}
else if(Window.ActiveXObject)
{
//在IE6及其以下浏览器可以通过ActiveXObject的两个控件来创建,将版本新的放在前面
var activexName=["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
for(var i=0; i<activexName.length; i++)
{
try
{ //取出一个控件名进行创建,创建成功就终止循环
xmlHttp=new ActiveXObject(activexName[i]);
break;
}
catch(e){};
}
}
//确认XMLHttpRequest对象创建成功
if(!xmlHttp)
{
alert("XMLHttpRequest对象创建失败!");
return;
}
else
{
//alert(xmlHttp);
return xmlHttp;
}
}
2.注册回调函数
xmlHttp.onreadystatechange=callback;
3.初始化XMLHttpRequest对象,设置连接信息
//第一个参数表示http的请求方式,分为GET和POST两种,GET方式请求的参数在URL中
//第二个参数表示请求的url地址,该地址会被解析为绝对地址
//第三个参数表示请求方式是同步或是异步,默认是同步true,第四,五个参数通常不用
xmlHttp.open("GET",url, true);
4.发送数据,开始和服务器端进行交付
//同步方式下:send()这句话会在服务器端的数据传送回来后才执行完,再执行下一条语句
//异步方式下:send()这句话会立即执行完,接着执行下一条语句
//若以POST方式,需要自己设置http的请求头
//xmlHttp.open("POST",url,true);
//xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//xmlHttp.send("name="+value);
xmlHttp.send(null); //该参数为可选,此时也可不写
5.定义回调函数,该函数主要负责接收从服务器端传回来的数据,并在页面上显示
function callback()
{
//判断对象的交互状态是否完成
if(xmlHttp.readyState==4)
{
//判断http的交互是否成功
if(xmlHttp.status==200)
{
//获取服务器端返回的数据,以纯文本数据或xml文档格式的数据
var responseText=xmlHttp.responseText;
//将响应数据显示在页面上
//以DOM方式或JQuery方式获取文档节点
var divNode=document.getElementById("#divNode_ID");
divNode.innerHTML=responseText;
}
}
}