原生ajax请求

1. 创建xhr 核心对象

var xhr=new XMLHttpRequest();

2.调用open 准备发送

• 参数一：请求方式
• 参数二: 请求地址
• 参数三：true异步，false 同步

xhr.open('post','http://www.baidu.com/api/search',true)

如果是post请求，必须设置请求头。

xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')

3.调用send 发送请求 （如果不需要参数，就写null）

xhr.send('user=tom&age=10&sex=女')

4.监听异步回调 onreadystatechange

• 判断readyState 为4 表示请求完成
  • 0 － （未初始化）还没有调用send()方法
  • 1 － （载入）已调用send()方法，正在发送请求
  • 2 － （载入完成）send()方法执行完成，已经接收到全部响应内容
  • 3 － （交互）正在解析响应内容
  • 4 － （完成）响应内容解析完成，可以在客户端调用了
• 判断status 状态码 为 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格式数据。
设置请求头

xhr.setRequestHeader('Content-Type', 'application/json')

open发送数据

xhr.open({_id:xxx,user:xxxx,age:xxxx})

全部代码

//1.创建ajax对象
//只支持非IE6浏览器
var oAjax = null;
if(window.XMLHttpRequest){
	oAjax = new XMLHttpRequest();				
	//alert(new XMLHttpRequest());
}else{
	//只支持IE6浏览器
	oAjax = new ActiveXObject("Microsoft.XMLHTTP");	
}
//2.连接服务器,这里加个时间参数,每次访问地址都不一样,浏览器就不用浏览器里的缓冲了,但
//	但服务器那端是不解析这个时间的
oAjax.open("get","a.txt?t=" + new Date().getTime(),true);
//3.发送
oAjax.send(null);		
//4.接受信息
oAjax.onreadystatechange = function(){
	//浏览器与服务器之间的交互,进行到哪一步了,当等于4的时候,代表读取完成了
	if(oAjax.readyState==4){
		//状态码,只有等于200,代表接受完成,并且成功了
		if(oAjax.status==200){
			// responseText 返回的数据
			alert("成功" + oAjax.responseText);	
		}else{
			alert("失败");	
		}	
	}	
};