目录
一、认识ajax
AJAX 是 Asyn JavaScript And XML(异步JavaScript 和 XML) 的首字母缩写。
AJAX 并不是一种新的编程语言，而是一种使用现有标准的新方法，AJAX是在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的艺术
AJAX 的核心是 XMLHttpRequest 对象
1.AJAX 基于开放的标准
- JavaScript
- XML
- HTML
- CSS
2.XMLHttpRequest 对象的三个常用的属性
1. onreadystatechange 属性
onreadystatechange 属性存有处理服务器响应的函数。
xmlHttp.onreadystatechange = function() {
//需要写的代码
}2. readyState 属性
readyState 属性存有服务器响应的状态信息。
readyState属性有五个状态值。
0：是uninitialized，未初始化。已经创建了XMLHttpRequest对象但是未初始化。
1：是loading，send for request but not called .已经开始准备好要发送了。
2：是loaded, send called,headers and status are available。已经发送，但是还没有收到响应。
3：是interactive，downloading response,but responseText only partial set.正在接受响应，但是还不完整。
4：是completed，finish downloading.接受响应完毕。
在 onreadystatechange 函数里 可以使用if来测试响应是否完成
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
//从服务器的response获得数据
}
}3. responseText 属性
可以通过 responseText 属性来取回由服务器返回的数据。
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
document.myForm.time.val = xmlHttp.responseText;
}
}3.XMLHttpRequest 对象的方法
1.open（）：
打开XMLHttpRequest对象。有三个参数：
method 方法有get，post，delete，put。如果查数据，从服务器中得到数据，使用get。如果直接提交到服务器中，更新数据，则使用post；
url 是请求资源的地址。
boolean 表示是否使用异步。默认情况是true，因为ajax的特点就是异步传送。若使用同步则false。
xmlHttp.open("GET","url",true);2.send（）：
将请求发往服务器。其中发送的内容可以是需要的参数，若是没有参数，直接send（null)
xmlHttp.send(null);二.原生AJAX创建的过程
1.创建xhr核心对象
var xhr=new XMLHttpRequest();2.调用open准备发送
参数一：请求方式
参数二：请求地址
参数三：true异步，false同步
xhr.open('post','http://www.baidu.com/api/search',true)3.如果是post请求，必须设置请求头
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')4.调用send发送请求（如果不需要参数，就写null）
xhr.send('user=tom&age=10&sex=女')5.监听异步回调 onreadystatechange
判断readyState 为4 表示请求完成
判断readyStatus 状态码 为 200 表示接口请求成功
responeseText 为相应数据。字符串类型。
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
console.log(xhr.responseText);
var res=JSON.parse(xhr.responseText);
console.log(res);
if(res.code==1){
modal.modal('hide');
location.reload();
}
}
}备注：如果是post请求，想要传json格式数据。
1.设置请求头
xhr.setRequestHeader('Content-Type', 'application/json')2.open发送数据
xhr.open({_id:xxx,user:xxxx,age:xxxx})