手写Ajax

//创建xhr
function createXHR(){
    let xhr = null;
    try{
        xhr = new XMLHttpRequest();
    }catch(e){
        xhr = new ActiveXObject('Microsoft.XMHTTP');
    }
    return xhr;
}

// 转义字符
function params(data){
 var arr = [];
 for(var i in data){
     arr.push(encodeURIComponent(i) + "=" + encodeURIComponent(data[i]));
 }
 return arr.join("&");
}

// 封装ajax
function ajax(obj){
 var xhr = createXHR();
 obj.url += "?rand=" + Math.random(); // 清除缓存
 obj.data = params(obj.data);      // 转义字符串
 if(obj.method === "get"){      // 判断使用的是否是get方式发送
     obj.url += obj.url.indexOf("?") == "-1" ? "?" + obj.data : "&" + obj.data;
 }
 // 异步
 if(obj.async === true){
     // 异步的时候需要触发onreadystatechange事件
     xhr.onreadystatechange = function(){
         // 执行完成
         if(xhr.readyState == 4){
             callBack();
         }
     }
 }
 xhr.open(obj.method,obj.url,obj.async);

 if(obj.method === "post"){
     xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
     xhr.send(obj.data);
 }else{
     xhr.send(null);
 }
 // xhr.abort(); // 取消异步请求
 // 同步
 if(obj.async === false){
     callBack();
 }
 // 返回数据
 function callBack(){
     // 判断是否返回正确
     if(xhr.status == 200){
         obj.success(xhr.responseText);
     }else{
         obj.Error("获取数据失败,错误代号为:"+xhr.status+"错误信息为:"+xhr.statusText);
     }
 }
}

//调用
ajax(   {
     "method" : "get",
     "url" : "1.txt",
     // "data" : {
     //     "uid" : uid,
     //     "pwd" : pwd
     // },
     "success" : function(data){
         alert(data);
     },
     "Error" : function(text){
         alert(text);
     },
     "async" : false

});
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值