封装原生的AJAX 图书管理系统` `` `` `` `` `` `` `` `` `` `` `` `` `` ``

<script>
  // GET
  // itlzx({
  //   method: 'GET',
  //   url: 'http://www.liulongbin.top:3006/api/getbooks',
  //   data: {
  //     //不指定data会返回所有的图书信息
  //     id: 1
  //   },
  //   success: function(res) {
  //     console.log(res);}
  // })

  //POST
  itlzx({
    method: 'POST',
    url:'http://www.liulongbin.top:3006/api/addbook',
    data:{
      bookname:'学习jsxzl',
      author:'施耐庵',
      publisher:'湖北文理学院出版社'
    },
    success:function (res) {
      console.log(res);
    }
  })


</script>

function resolveData(data) {
   var arr = [];
   for(var k in data) {
     var str = k + '=' +data[k];
     arr.push(str);
   }
   return arr.join('&');
}
// 接受返回值
// var res = resolveData({name : 'zs', age : 20});
//打印结果
// console.log(res)

function itlzx(options) {
  var xhr = new XMLHttpRequest();
  //把外界传递过来的参数对象，查询字符串
  var qs = resolveData(options.data);

  if(options.method.toUpperCase()==='GET'){
    //发起GET请求
    xhr.open(options.method,options.url +'?' +qs);
    xhr.send();
  }else if(options.method.toUpperCase()==='POST'){
    //发起POST请求
    xhr.open(options.method,options.url);
    xhr.setRequestHeader('content-Type','application/x-www-form-urlencoded');
    xhr.send(qs);
  }
  //监听请求状态改变的事件
  xhr.onreadystatechange = function () {
     if(xhr.readyState===4 && xhr.status ===200) {
        var result = JSON.parse(xhr.responseText);
        options.success(result);
     }
  }

}