Javascript Ajax总结——XMLHttpRequest对象

Ajax技术能向服务器异步请求额外的数据，会带来更好的用户体验。
Ajax技术核心：XMLHttpRequest对象（简称XHR）。
XHR为向服务器发送请求和解析服务器响应提供了流畅的接口。

1、创建XMLHttpRequest对象

创建XMLHttpRequest对象：

1 var xhr = new XMLHttpRequest();

注：IE7+、Firefox、Opera、Chrome和Safari支持原生XHR对象。
（但是我测试IE5也支持原生XHR对象，可能是做了更新）

IE7及之前的版本需要使用MSXML库中的XHR对象。
如下所示，可以兼容几乎所有浏览器：

 1 function createXHR() {
 2         if(typeof  XMLHttpRequest != "undefined"){
 3             return new XMLHttpRequest();                         //IE7+、Firefox、Opera、Chrome、Safari
 4         }
 5         else if(typeof ActiveXObject != "undefined"){
 6              return  new ActiveXObject("Microsoft.XMLHTTP");     //IE7及以前版本的浏览器
 7         }
 8         else{
 9             throw new Error("No XHR object available.");
10         }
11     }
12 var xhr = createXHR();

2、XHR用法

 1 var xhr = createXHR();                                                     //创建XHR对象
 2 xhr.onreadystatechange = function(){                                       //readyState状态改变及触发onreadystatechange事件
 3     if(xhr.readyState == 4){                                               //readyState状态改变可从0到4，4表示所有数据已就绪
 4         if((xhr.status >= 200 && xhr.status <300) || xhr.status == 304){   //status为200，响应成功；为304，表示请求的资源未被修改
 5             alert(xhr.responseText);                                       //responseText表示响应主体返回的文本
 6 　　　　} else {
 7             alert(“Request was unsuccessful: ” + xhr.status);
 8 　　　　}
 9 　　}
10 };
11 xhr.open(“get”, “test.php”, true);                                          //启动一个请求以备发送
12 xhr.send(null);                                                             //发送请求

 

转载于:https://www.cnblogs.com/wuxxblog/p/11108369.html