Ajax

1.什么是Ajax？（纯客户端技术）

异步 JavaScript和XML（标准通用标记语言的子集）。

目标：提高用户的浏览体验。

2.Ajax实现的效果

（1）客户端和服务器异步运行；

（2）客户端页面局部刷新；

（3）动态页面的静态化；

涉及到的技术：HTML、CSS、JS、DOM、XML、JSON等。

3.同步（synchronous）和异步（Asynchronous）

同步：客户端发起请求服务器给予响应（经典的B/S模型）

异步：客户端和服务器同时进行（异步的B/S模型）

4.创建XMLHttpRequest

var xhr=null;

xhr=new XMLhttpRequest();(XMLDOM对象)

xhr=new ActiveXObject（Microsoft.XMLHTTP）

if(window.XMLHttpRequest){//其他浏览器

　　xhr=new XMLHttpRequest();

}else{//老IE

      xhr=new ActiveXObject("Microsoft.XMLHTTP")}

5.XMLHttpRequest的常用成员（重点）；

xhr对象的作用：发起http请求消息，并接收服务器返回的响应消息。

（1）常用成员属性：

status：0                  保存着服务器返回的响应消息的状态码；

statusText：“”           保存着返回响应消息的原因短句；

responseText：“”       保存着响应消息的主体看做——一段string；

responseXML:null;     保存着响应消息的主体——看做一个XMLDOM对象；

timeout：0                设置XHR发起请求消息后，等待服务器发出的响应时间；

readyState：0            0-UNSENT 请求消息尚未发送；

                                1-OPENED  XHR已创建请求消息，打开针对服务器的连接

                                2-HEARDERS_RECEIVED XHR对象已经接收到响应

                                3-LOADING XHR正在加载响应主题数据

                                4-DONE  XHR对象应经接收完毕响应消息

---

 

（2）常用的成员事件

onreadystatechange：fn                        当XHR的readyState的值发生改变，触发此句柄

ontimeout：fn                                      当XHR的请求超时，触发句柄

onerror：fn                                          当XHR发生请求/响应错误，触发此句柄

---

（3）常用成员方法：

getAllResponseHeaders（）                    获取响应消息中所有的头部；

getResponseHeader（hearderName）      获取响应消息中指定的头部；

open（MESTHED,URI,isAysnc）               创建一个http请求消息；

send（null/data）                                  发送http请求消息；

setResquestHeader（name，value）        在请求消息发送之前，设置一个请求

---

 

6.使用AJAX的步骤

（1）创建XHR对象

（2）绑定onreadtstatechange事件监听函数

（3）创建请求消息，建立到服务器的连接

（4）发送请求消息

ps：//创建XHR对象

var xhr=null;

if(window.XMLHttpRequest){//其他浏览器

　　xhr=new XMLHttpRequest();

}else{//老IE

      xhr=new ActiveXObject("Microsoft.XMLHTTP")

}

//绑定事件监听函数

xhr.onreadystatechange=function(){

         

}

//创建http请求消息，连接到服务器

xhr.open("GET/POST",".php(文件名)",true);

//发送请求信息

xhr.send(null/data)