# XHR
- [XHR](#XHR_1)
- [属性](#_4)
- [方法](#_12)
- [get](#get_23)
- [post](#post_45)
# XHR
XHR英文全名XmlHttpRequest，中文可以解释为可扩展超文本传输请求。Xml可扩展标记语言，Http超文本传输协议，Request请求。XMLHttpRequest对象可以在不向服务器提交整个页面的情况下，实现局部更新网页。当页面全部加载完毕后，客户端通过该对象向服务器请求数据，服务器端接受数据并处理后，向客户端反馈数据。 XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问，包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步返回 Web 服务器的响应，并且能以文本或者一个 DOM 文档形式返回内容。尽管名为 XMLHttpRequest，它并不限于和 XML 文档一起使用：它可以接收任何形式的文本文档。XMLHttpRequest 对象是名为 AJAX 的 Web 应用程序架构的一项关键功能。
# 属性
属性说明readyState表示XMLHttpRequest对象的状态：
0：未初始化。对象已创建，未调用open；
1：open方法成功调用，但Send方法未调用；
2：send方法已经调用，尚未开始接受数据；
3：正在接受数据。Http响应头信息已经接受，但尚未接收完成；
4：完成，即响应数据接受完成。onreadystatechange请求状态改变的事件触发器（readyState变化时会调用这个属性上注册的javascript函数）。responseText服务器响应的文本内容responseXML服务器响应的XML内容对应的DOM对象status服务器返回的http状态码。
200表示“成功”，
404表示“未找到”
500表示“服务器内部错误"
statusText 服务器返回状态的文本信息。# 方法
方法说明Open(string method,string url,boolean asynch,String username,string password)指定和服务器端交互的HTTP方法，URL地址，即其他请求信息；
Method:表示http请求方法，一般使用"GET","POST".
url：表示请求的服务器的地址；
asynch：表示是否采用异步方法，true为异步，false为同步；
后边两个可以不指定，username和password分别表示用户名和密码，提供http认证机制需要的用户名和密码。Send(content)向服务器发出请求，如果采用异步方式，该方法会立即返回。
content可以指定为null表示不发送数据，其内容可以是DOM对象，输入流或字符串。SetRequestHeader(String header,String Value)设置HTTP请求中的指定头部header的值为value.此方法需在open方法以后调用，一般在post方式中使用。
(.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8");)getAllResponseHeaders()返回包含Http的所有响应头信息，其中相应头包括Content-length,date,uri等内容。返回值是一个字符串，包含所有头信息，其中每个键名和键值用冒号分开，每一组键之间用CR和LF（回车加换行符）来分隔！getResponseHeader(String header)返回HTTP响应头中指定的键名header对应的值Abort()停止当前http请求。对应的XMLHttpRequest对象会复位到未初始化的状态。## get
```
function get(url, data, callback) {
var xml = new XMLHttpRequest();
var arrData = [];
if (data != null) {
for (var item in data) {
arrData.push(item + '=' + data[item]);
}
}
var param = arrData.join('&');
xml.open('get', url + '?' + param);
xml.onreadystatechange = function() {
if (xml.readyState == 4 && xml.status == 200) {
callback && callback(JSON.parse(xml.responseText));
}
}
xml.send(null);
}
```
## post
```
function post(url, data, callback) {
var xml = new XMLHttpRequest();
var arrData = [];
if (data != null) {
for (var item in data) {
arrData.push(item + '=' + data[item]);
}
}
var param = arrData.join('&');
xml.open('post', url);
xml.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
xml.onreadystatechange = function() {
if (xml.readyState == 4 && xml.status == 200) {
callback && callback(JSON.parse(xml.responseText));
}
}
xml.send(param);
}
```
