0
点赞
收藏
分享

微信扫一扫

Ajax的函数封装

有点d伤 2022-01-20 阅读 48

Ajax是前端的异步加载技术,可以做到网页的局部刷新,提升用户体验,提高网络的利用率,主要利用XMLHttpRequest对象的方法作为传输的方式;封装之后的Ajax可以根据不同的请求参数,返回响应的内容,下面是对Ajax的封装:

 ///传入的参数
    // type:传参的方式
    // url:传参的地址
    // isAsyn:是否异步
    // data:请求参数
    // callBack:接收响应值的方法

   function ajaxFun(type,url,data,isAysn,callback){
    type = type.toLowerCase();
    let xhr = new XMLHttpRequest();
    if(type=='get'){
        let urlParam = url;
        if(data !=""){
            // xhr.open(type,url,isAysn);
            urlParam=url+"?"+data;
        }else{
            // let dataParam = url+"?"+data;
            // xhr.open(type,dataParam,isAysn);
            urlParam=url;
        }
        xhr.open(type,urlParam,isAysn);
        xhr.send();
    }else if(type=="post"){
        xhr.open(type,url,isAysn);
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xhr.send(data);
    }
    xhr.onreadystatechange = function(){
        if(xhr.status==200 && xhr.readyState==4){
            callback(xhr.responseText);
        }
    }
}
//后端响应的responseText可以在callback回调函数中进行操作
举报

相关推荐

0 条评论