XMLHttpRequest对象

XMLHttpRequest是什么

• XMLHttpRequest 是一个API, 它为客户端提供了在客户端和服务器之间传输数据的功能。它提供了一个通过 URL 来获取数据的简单方式，并且不会使整个页面刷新。这使得网页只更新一部分页面而不会打扰到用户。XMLHttpRequest 在 AJAX 中被大量使用。
• XMLHttpRequest 是一个 JavaScript 对象，它最初由微软设计,随后被 Mozilla、Apple 和 Google采纳. 如今,该对象已经被 W3C组织标准化. 通过它,你可以很容易的取回一个URL上的资源数据. 尽管名字里有XML, 但 XMLHttpRequest 可以取回所有类型的数据资源，并不局限于XML。 而且除了HTTP ,它还支持file 和 ftp 协议.

创建对象

    let XML = null;    if(window.XMLHttpRequest){        //IE7+等        XML = new XMLHttpRequest();    }else{        //IE5、IE6        XML = new ActiveXObject("Microsoft.XMLHTTP);    }

常用属性

名称 说明 readyState 请求的状态，0：open()方法还未被调用.1：send()方法还未被调用.2：send()方法已经被调用, 响应头和响应状态已经返回.3：响应体下载中; responseText中已经获取了部分数据.4：整个请求过程已经完毕. status 请求返回的状态，如:200 statusText 请求返回的文字状态，如:ok responseType 预期从服务器返回的数据格式，如:’json’,’text’,默认为字符串 response 从服务器返回的数据 responseText 从服务器返回的text responseXML 从服务器返回的XML

常用方法

名称 说明 open 初始化一个请求，3个参数，method:请求的方式，url:请求的url,async:是否异步，默认为true send 发送请求，一个参数，content:发送的内容 abort 如果请求已经被发送,则立刻中止请求. setRequestHeader 调用open之后才能用这个方法，设置请求头部，格式为”header”,”value” onreadystatechange readyState变化都会自动调用这个函数 getAllResponseHeaders 获取响应头部的所有信息 getResponseHeader 获取一个header,一个参数，为”header”

实例

    let ajax;    if(window.XMLHttpRequest){        //IE7+等        ajax = new XMLHttpRequest();    }else{        //IE5、6        ajax = new ActiveXObject("Microsoft.XMLHTTP");    }    //    if(ajax){        ajax.open('GET','/resource');        ajax.send();        ajax.responseType='JSON';        ajax.onreadystatechange = function(){            if(4 == ajax.readyState && 200==ajax.status){                console.log(ajax.response);                console.log(ajax.getAllResponseHeaders());            }        }    }

---

参考文章

https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest

http://www.w3school.com.cn/xml/xml_http.asp

http://www.runoob.com/ajax/ajax-tutorial.html