原生 XMLHttpRequest 一、什么是XMLHttpRequest? 二、XMLHttpRequest能干什么？ 三、XMLHttpRequest的open()和send()方法 四、XMLHttpRequest 对象的重要属性： 五、原生XMLHttpRequest代码实现
XHR英文全名XmlHttpRequest，中文可以解释为可扩展超文本传输请求。Xml可扩展标记语言，Http超文本传输协议，Request请求。XMLHttpRequest对象可以在不向服务器提交整个页面的情况下，实现局部更新网页。当页面全部加载完毕后，客户端通过该对象向服务器请求数据，服务器端接受数据并处理后，向客户端反馈数据。 XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问，包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步返回 Web 服务器的响应，并且能以文本或者一个 DOM 文档形式返回内容。尽管名为 XMLHttpRequest，它并不限于和 XML 文档一起使用：它可以接收任何形式的所有现代的浏览器都支持 XMLHttpRequest 对象。
二、XMLHttpRequest能干什么？
1、在不重新加载页面的情况下更新网页
2、在页面已加载后从服务器请求数据
3、在页面已加载后从服务器接收数据
4、在后台向服务器发送数据
三、XMLHttpRequest的open()和send()方法
1、open(method,url,async)方法
method:请求类型（GET或POST）
url:文件在服务器上的位置
async:ture(异步)或 false(同步)
2、send(string)方法
string:仅用于POST请求
四、XMLHttpRequest 对象的重要属性：
（1）readyState存有XMLHttpRequest 的状态，0~4。
0——请求未初始化
1——服务器连接已经建立
2——请求已接受
3——请求处理中
4——请求已完成，且响应已就绪。
（2）status，HTTP的特定状态码：
100-199：信息性的标示用户应该采取的其他动作。
200-299：表示请求成功。
300-399：用于那些已经移走的文件，常常包括Location报头，指出新的地址。
400-499：表明客户引发的错误。
500-599：由服务器引发的错误。
五、原生XMLHttpRequest代码实现
<script>
//创建XMLHttpRequest对象
var xhr;
if(window.XMLHttpRequest){
//IE7+,Firefox，Chrome，Opera,Safari 执行
xhr = new XMLHttpRequest();
}else{
// IE6,IE5 执行
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
// GET 请求
xhr.open("GET","url",true);
xhr.send();
// POST 请求
xhr.open("POST","url",true);
xhr.send();
//如果需要传参，则需要使用setRequestHeader() 来添加HTTP 头部
xhr.open("POST","url",true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.send("name=tome&age=24");
// 通过 onreadystatechange 事件来监听状态变化，并获取服务器响应
xhr.onreadystatechange = function(){
//请求成功时
if(xhr.readyState == 4 && xhr.status == 200){
alert(xhr.responseText);
}
}
</script>