Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步hQ从服务器获得数据,然后用javascript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。要清楚q个q程和原理,我们必须?XMLHttpRequest有所了解?
XMLHttpRequest是ajax的核心机Ӟ它是在IE5中首先引入的Q是一U支持异步请求的技术。简单的_也就是javascript可以及时向服务器提出h和处理响应,而不d用户。达到无h的效果?
所以我们先从XMLHttpRequest讲vQ来看看它的工作原理?
首先Q我们先来看看XMLHttpRequestq个对象的属性?
它的属性有Q?
onreadystatechange 每次状态改变所触发事g的事件处理程序?
responseText 从服务器q程q回数据的字W串形式?
responseXML 从服务器q程q回的DOM兼容的文数据对象?
status 从服务器q回的数字代码,比如常见?04Q未扑ֈQ和200Q已qAQ?
status Text 伴随状态码的字W串信息
readyState 对象状态?
0 (未初始化) 对象已徏立,但是未初始化(未调用openҎQ?
1 (初始? 对象已徏立,未调用sendҎ
2 (发送数? sendҎ已调用,但是当前的状态及http头未?
3 (数据传送中) 已接攉分数据,因ؓ响应及http头不全,q时通过responseBody和responseText获取部分数据会出现错误,
4 (完成) 数据接收完毕,此时可以通过通过responseXml和responseText获取完整的回应数?
但是Q由于各览器之间存在差异,所以创Z个XMLHttpRequest对象可能需要不同的Ҏ。这个差异主要体现在IE和其它浏览器之间。下面是一个比较标准的创徏XMLHttpRequest对象的方法?
function CreateXmlHttp()
{
//非IE览器创建XmlHttpRequest对象
if(window.XmlHttpRequest)
{
xmlhttp=new XmlHttpRequest();
}
//IE览器创建XmlHttpRequest对象
if(window.ActiveXObject)
{
try
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
try{
xmlhttp=new ActiveXObject("msxml2.XMLHTTP");
}
catch(ex){}
}
}
}
function Ustbwuyi()
{
var data=document.getElementById("username").value;
CreateXmlHttp();
if(!xmlhttp)
{
alert("创徏xmlhttp对象异常Q?);
return false;
}
xmlhttp.open("POST",url,false);
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
{
document.getElementById("user1").innerHTML="数据正在加蝲...";
if(xmlhttp.status==200)
{
document.write(xmlhttp.responseText);
}
}
}
xmlhttp.send();
}
如上所C,函数首先查XMLHttpRequest的整体状态ƈ且保证它已经完成QreadyStatus=4Q,x据已l发送完毕。然后根据服务器的设定询问请求状态,如果一切已l就l(status=200Q,那么执行下面需要的操作?
对于XmlHttpRequest的两个方法,open和sendQ其中openҎ指定了:
a、向服务器提交数据的cdQ即postq是get?
b、请求的url地址和传递的参数?
c、传输方式,false为同步,true为异步。默认ؓtrue。如果是异步通信方式(true)Q客h׃{待服务器的响应Q如果是同步方式(false)Q客hp{到服务器返回消息后才去执行其他操作。我们需要根据实际需要来指定同步方式Q在某些面中,可能会发出多个请求,甚至是有l织有计划有队Ş大规模的高强度的requestQ而后一个是会覆盖前一个的Q这个时候当然要指定同步方式?
SendҎ用来发送请求?
知道了XMLHttpRequest的工作流E,我们可以看出QXMLHttpRequest是完全用来向服务器发Z个请求的Q它的作用也局限于此,但它的作用是整个ajax实现的关键,因ؓajax无非是两个过E,发出h和响应请求。ƈ且它完全是一U客L的技术。而XMLHttpRequest正是处理了服务器端和客户端通信的问题所以才会如此的重要?
现在Q我们对ajax的原理大概可以有一个了解了。我们可以把服务器端看成一个数据接口,它返回的是一个纯文本,当然Q这个文本流可以是XML格式Q可以是HtmlQ可以是Javascript代码Q也可以只是一个字W串。这时候,XMLHttpRequest向服务器端请求这个页面,服务器端文本的l果写入面Q这和普通的web开发流E是一LQ不同的是,客户端在异步获取q个l果后,不是直接昄在页面,而是先由javascript来处理,然后再显C在面。至于现在流行的很多ajax控gQ比如magicajax{,可以q回DataSet{其它数据类型,只是这个过E封装了的结果,本质上他们ƈ没有什么太大的区别?