原生Ajax的创建过程

原生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

• 判断readtState 为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请求，想要传格式数据

设置请求头

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

open发送数据

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