Ajax实现异步请求步骤

一、原生JS实现:

var request = new XMLHttpRequest();  //创建XMLHttpRequest()对象

//启动一个HTTP请求,但未发送请求到服务端,最后一个参数默认为false,异步发送。
request.open("GET/POSt", url, true/false);  //使用GET方法时直接在的url上传递参数。


//使用POST方法时要通过send方法传递参数给服务端
var data = "str";  //str为获取表单元素的值或其它需要更新的内容


//设置头信息,表明发送的是表单元素
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

//发送请求到服务端
request.send(null/data);


//onreadystatechange事件会在readystate属性改变时触发,监控readyState属性
request.onreadystatechange = function() {

//状态码为4表示请求已完成,响应内容已就绪
  if (request.readyState === 4) {


    //状态码304表示请求资源没有被修改,可以使用浏览器缓存
    if ((request.status >= 200 && request.status < 300) || request.status == 304) {


      //服务器返回的是json对象,使用JSON.parse()方法格式化为js对象。
      var data = JSON.parse(request.responseText);


      if (data.success) {
        //处理响应成功返回的数据

    
      } else {
        //处理响应失败返回的数据


      }
    } else {
      //处理请求失败返回的数据
    }
  }
}

//前后端交互约定,约定success为true或者false时返回不同的信息,
//通过success属性可以方便前端调用返回的信息。
{
  "success" : true,
  "msg": "xxx",
}

二、jQuery实现

原文地址:https://www.cnblogs.com/chenzechuang/p/6637794.html