《HeadRush Ajax》
流程:
1.构建request:
functioncreateRequest() //构造request
{
varrequest = null;
try {
request = new XMLHttpRequest(); // 非IE浏览器
}catch(trymicrosoft)
{
try {
request = new ActiveXObject("Msxm12.XMLHTTP");
} catch (othermicrosoft)
{
try{
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch(failesd)
{request=null;}
}
}
if(request==null)
{alert("can not create request");}
else{
return request;
}
}
2.send request:
//利用POST获得数据方法,send的是文本数据,用头文件向server表明
//三参true表示异步请求,false表示同步
varurl = "chat.php";
request1.open("POST",url,true);
request1.onreadystatechange = updatePage; // updatePage为函数,此处注意无括号
request1.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
request1.send("username="+username+"&title="+title+"&mess="+mess);
//利用GET获得数据
varurl = "chat.php?username="+username+"&title="+title+"&mess="+mess;
request1.open("GET",url,true);
request1.onreadystatechange =updatePage; //此语句必须在send前执行
request1.send(null);
3.处理回应,更新页面
if(request1.readyState== 4) // readyState为4表明浏览器从server获得response
{
if(request1.status == 200) //判断是否为正确response
{
var chattext = request1.responseText; // response为text形式得到反馈信息
var chatXML = request1.responseXML;//response为XML形式得到反馈
var isValid =chatXML.getElementsByTagName("isValid")[0];//得到返回的XML信息中第一个标志为isValid的node;
var Div = document.getElementById("charTextForm");
Div.innerHTML=chattext; // 我去,这个就可以 了解释标签 当换成xml时,不需用此命令。可以直接用DOM对XML和HTML树进行操作
}
}
else
alert("request's status is wrong:"+request1.status);
}
}
4.PHP端代码
header("Content-Type:text/xml"); //告诉浏览器,response为XML
echo""; echo"
?>
5.注意问题
a.注意request被覆盖问题。 即前面的request在被完执行的过程中再次sendrequest的话,会覆盖之前的request。此时可以通过构建另一个request来解决。
b.一些浏览器利用cache,并不发送相同的request。此时可以通过在url上添加一个随机参数来发送请求。如(url="chat.php?para="+newDate().getTime() ; )