Ajax的全称是Asynchronous JavaScript and XML，是JS的特有功能，它作用是异步JS数据交互，即在不进行页面刷新的情况下进行部分数据的获取，性能较高。值得注意的是，仅有Ajax是不能够实现跨域的操作，如果和JSONP或者WebSocket配合可以实现。
Ajax工作方式：
1.Ajax成员属性
(1)responseText 后台返回数据存放的位置，返回值为字符串型
(2)readyState 系统记录执行的步骤，共有5个值：0 尚未初始化
1 服务连接已建立(open)
2 请求已接收(send)
3 请求处理中
4 请求完成
(3)responseXML 返回类型是XML类型，90%使用JSON方式
(4)status 服务器返回的http响应值，常用如下：
-
- 200 请求成功
- 400 错误请求
- 500 内部服务器错误
2.Ajax成员方法
(1)open(method,url) 打开方式，method为两种：POST/GET
(2)send(body) 确认发送请求
(3)setRequestHeader(name,value) 设置请求头部
使用方式：xhr.setRequestHeader(‘content-type’,’application/x-www-form-urlencoded’);
form的enctype属性为编码方式，常用有两种：application/x-www-form-urlencoded和multipart/form-data
3.Ajax监听事件
onreadystatechange 状态变化事件控制对象，注意这个事件名全部是小写而非驼峰式命名，不过平时会有代码生成帮助我们
4.Ajax实现四步骤
Ajax有一句常用的话，1个事件(onreadystatechange)、2个属性(responseText和readyState)、3个方法(open/send/setRequestHeader)，在使用Ajax的时候经常会用到对应的内容。
(1)var xhr = new XMLHttpRequest();//创建XMLHttpRequest对象
(2)xhr.onreadystatechange=function(){
console.log(xhr.readyState);
console.log(xhr.responseText);
}//xhr对象改变时自动调用此函数
(3)xhr.open(‘GET‘,‘data.txt‘);//从data.txt中获取内容
(4)xhr.send(null);//发送请求
5.Ajax请求
(1)GET 此方式负责从后台获取数据，常用于验证用户
GET的请求头部一般可以不写，默认为xhr.setRequestHeader(‘content-type’,’application/x-www-form-urlencoded’)
(2)POST 此方式向后台发送表单数据，如密码
POST的请求头部需要分情况而定，当表单method="post"时，如果没有type="file"控件，使用application/x-www-form-urlencoded，反之，使用multipart/form-data
6.代码样例
在使用之前，需要先创建一个data.txt的文档。
1 <script>
2 var box = document.querySelector(‘div’);
3 var btn = document.querySelector(‘button’);
4 btn.onclick = function(){
5 var xhr = new XMLHttpRequest();
6 xhr.onreadystatechange = function(){
7 box.innerHTML = xhr.responseText;
8 }
9 xhr.open(‘GET’,’data.txt’);
10 xhr.send(null);
11 }
12 </script>