博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
原生JS实现$.ajax
阅读量:6869 次
发布时间:2019-06-26

本文共 2030 字,大约阅读时间需要 6 分钟。

1     function ajax(obj){ 2             obj=obj||{}; 3             obj.type=(obj.type||'GET').toUpperCase(); 4             obj.dataType=obj.dataType||'json'; 5             var params=formatParams(obj.data);//参数格式化 6  7             //step1:兼容性创建对象 8             if(window.XMLHttpRequest){ 9                 var xhr=new XMLHttpRequest();10             }11             else{12                 var xhr=new ActiveXObject('Microsoft.XMLHTTP');13             }14 15             //step4: 接收16             xhr.onreadystatechange=function(){17                 if(xhr.readtState==4){18                     if(xhr.state>=200 && xhr.status<300){19                         obj.success&&obj.success(xhr.responseText,xhr.responseXML);20                     }21                     else{22                         obj.error&&obj.error(xhr.status);23                     }24                 }25             }26 27             //step2 step3:连接 和 发送28             if(obj.type=='GET'){29                 xhr.open('GET',obj.url+'?'+params,true);30                 xhr.send(null);31             }32             else if(obj.type=='POST'){33                 xhr.open('POST',obj.url,true);34                 //设置请求头,以表单形式提交数据35                 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');36                 xhr.send(params);37             }38 39 40             //辅助函数,格式化参数41             function formatParams(data){42                 var arr=[];43                 for(var name in data){44                     arr.push(encodeURICompontent(name)+"="+encodeURICompontent(data[name]));45                 }46                 //设置随机数,防止缓存47                 arr.push("t="+Math.random());48                 return arr.join("&");49             }50 51            }

使用:

1 ajax({2     url:"www.baidu.com",3     type:"GET",4     dataType:"json",5     data:{a:"123",b:"456"},6     success:function(response.xml){
//todo something},7 error:function(status){
//todo something} 8 })

 

转载于:https://www.cnblogs.com/dll-ft/p/5846977.html

你可能感兴趣的文章
【 58沈剑 架构师之路】究竟啥才是互联网架构“高并发”
查看>>
ionic 自动生成APP图标与启动界面
查看>>
Sql存储过程
查看>>
dsquery命令查询总结
查看>>
利用openssl API进行简单网络编程
查看>>
过度加班? - 是该到了认真考虑的时候了。
查看>>
linux启动出问题
查看>>
linux查看哪些进程占用swap空间
查看>>
VS_断点无效
查看>>
关于“无敌删除命令”
查看>>
017 搭建eureka注册中心
查看>>
nis服务器搭建
查看>>
红帽企业存储管理之DRBD应用详解
查看>>
Linux下mail服务器架构之源码实现postfix邮件基本功能
查看>>
Bios加密
查看>>
Apache 服务+ AWStat分析系统的应用
查看>>
前端技术学习之选择器(六)
查看>>
使用 Docker 搭建 Tomcat 运行环境
查看>>
vim使用技巧
查看>>
牛反天望观测太阳系内目标的使用小记 (一)
查看>>