手动封装ajax请求

248 阅读1分钟
function ajax(opt){
  //配置默认参数
  var def={
    url:'www.baidu.com',
    type:'get',
    async:true,
    data:null,
    success:null,
    error:null
  }
  //调用合并参数
  var settings=extend({},def,opt)
  //调用格式化参数
  var data=typeof settings.data==='string'?settings.data:format(settings.data);
  //1.创建xhr
  var xhr=XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('MicrosoftXMLHTTP');
  //2.监听状态
  xhr.onreadystatechange=function(){
    if(xhr.readState===4){
      if(xhr.status===200){
        settings.success && settings.success(xhr.responseText); 
      }else{
        settings.error && settings.error();
      }
    }
  }
  //3.打开
  xhr.open(settings.type , settings.url+'?'+data , settings.async);
  //4.发送
  xhr.send(null);

}

function extend(){
  var arg=arguments;
  for(var i=1;i<arg.length;i++){
    for(var k in arg[i]){
      arg[0][k]=arg[i][k]
    }
    return arg[0]
  }
}

function format(){
  var arr=[];
  for(var k in obj){
    arr.push(k+'='+encodeURI(obj[k]))
  }
  return arr.join('&');
}