ajax基础

ajax 的全称是AsynchronousJavaScript and XML，其中，Asynchronous 是异步的意思，

它有别于传统web开发中采用的同步的方式。

同步和异步

异步传输是面向字符的传输，它的单位是字符；而同步传输是面向比特的传输，它的单位是桢，

它传输的时候要求接受方和发送方的时钟是保持一致的。

举个例子来说同步和异步，

同步就好像我们买楼一次性支付，而异步就是买楼分期付款。

所以当我们把这种生活中的概念化解释转移到理解Ajax异步上来就发现，

它是通过这样一种异步的方式来让用户更加收益，也就是说可以让用户的有更好的体验性。其实这也是Ajax的意义所在。

Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，

然后用javascript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。

要清楚这个过程和原理，我们必须对 XMLHttpRequest有所了解。

XMLHttpRequest是ajax的核心机制，是一种支持异步请求的技术。

简单的说，也就是javascript可以及时向服务器提出请求和处理响应，而不阻塞用户。

达到无刷新的效果。

XMLHttpRequest的常见属性

readystatechange时间用来检测每次状态变化后readystate的值。

readystate属性表示请求/响应过程的当前活动阶段 该属性可取的值如下

0：未初始化。尚未调用open()方法

1：启动。已经调用open()方法，但尚未接受响应

2：发送。已经调用send()方法

3：接收。已经接收到部分响应数据

4：完成。已经接收到全部响应数据，而且已经可以在客户端使用了

status:响应的http状态

statusText:HTTP状态的说明

responseText：作为响应主体被返回的文本

ajax的常见写法

创建xhr对象

function createXHR(){
if(typeof XMLHttpRequest!="undefined"){
return new XMLHttpRequest();
}else if(typeof ActiveXObject!="undefined"){
//ie7之前
if(typeof arguments.callee.activeXString!="string"){
var versions=[
"MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"
],
i,len;
for ( i = 0,len=versions.length; i < len; i++) {
try{
new ActiveXObject(versions[i]);
arguments.callee.activeXString=versions[i];
break;
}catch(ex){
}
}
}
return new ActiveXObject(arguments.callee.activeXString);
}else{
throw new Error("no XHR Object available");
}
}

利用ajax发送get请求

var ajaxGet=function(url,callback){
var xhr=createXHR();
xhr.onreadystatechange=function(){
if (xhr.readyState==4) {
if (xhr.status>=200&&xhr.status<300||xhr.status==304) {
callback(JSON.parse(responseText));
}else{
alert("request was unsuccessful:"+xhr.status);
}
}
}
xhr.open('get',url,true);
xhr.send(null);
}