js如何编写简单的ajax方法库


Posted in Javascript onAugust 02, 2017

本文实例为大家分享了js编写ajax方法库的具体代码,供大家参考,具体内容如下

具体代码

~function(){
  //ajax:实现ajax请求的公共方法;当一个方法传递的参数过多,而且还不固定,我们使用对象统一传值法(把需要传递的参数值都放在一个对象中,一起传递进去即可)
  function ajax(options){
    //把需要使用的参数值设定一个规则和初始值
    var _default = {
      url:"",//请求的地址
      type:"get",//请求的方式
      dataType:"json",//设置请求回来的内容格式
      async:true,//请求是同步还是异步
      data:null,//放在请求主体中的内容(POST)
      getHead:null,//当READY STATE===2的时候执行的回调方法
      success:null//当READY STATE===4的时候执行的回调方法
    };
    //使用用户自己传递进来的值覆盖我们的默认值
    for(var key in options){
      if(options.hasOwnProperty(key)){
        _default[key] = options[key];
      }
    }
    //如果当前的请求方式是get,我们需要在URL的末尾加随机数清楚缓存
    if(_default.type==="get"){
      _default.url.indexOf("?") >=0 ? _default.url += "&" : _default.url += "?";
      _default.url +="_="+Math.random();
    }
    //SEND AJAX
    var xhr = createXHR();
    xhr.open(_default.type,_default.url,_default.async);
    xhr.onreadystatechange = function(){
      if(/^2\d{2}/.test(xhr.status)){
        //想要在READY STATE等于2的时候做一些操作,需要保证AJAX是异步请求
        if(xhr.readyState === 2){
          if(typeof _default.getHead === "function"){
            _default.getHead.call(xhr);
          }
        }
        if(xhr.readyState === 4){
          var val = xhr.responseText;
          //如果传递的参数值是json,说明获取的内容应该是json格式的对象
          if(_default.dataType === "json"){
            val = "JSON" in window ? JSON.parse(val) : eval("("+val+")");
          }
          _default.success && _default.success.call(xhr,val)

        }
      }
    }
    xhr.send(_default.data);
  }
  window.ajax = ajax;
}()

ajax({
  url:"data.txt",
  type:"get",
  dataType:"json",
  async:false,
  getHead:function(){
    //this xhr当前AJAX对象
  },
  success:function(data){
    //this xhr当前AJAX对象
    //data:我们从服务器获取的主体内容
  }

})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
iframe 自适应高度[在IE6 IE7 FF下测试通过]
Apr 13 Javascript
JavaScript 变量基础知识
Nov 07 Javascript
详解JavaScript时间格式化
Dec 23 Javascript
Immutable 在 JavaScript 中的应用
May 02 Javascript
html+js实现简单的计算器代码(加减乘除)
Jul 12 Javascript
微信小程序 数据访问实例详解
Oct 08 Javascript
jQuery插件echarts去掉垂直网格线用法示例
Mar 03 Javascript
vue数字类型过滤器的示例代码
Sep 07 Javascript
Vue使用watch监听一个对象中的属性的实现方法
May 10 Javascript
layui添加动态菜单与选项卡 AJAX请求的例子
Sep 25 Javascript
JavaScript 作用域scope简单汇总
Oct 23 Javascript
原生js实现五子棋游戏
May 28 Javascript
JavaScript实现无刷新上传预览图片功能
Aug 02 #Javascript
基于jquery实现多选下拉列表
Aug 02 #jQuery
基于LayUI分页和LayUI laypage分页的使用示例
Aug 02 #Javascript
使用JavaScript实现链表的数据结构的代码
Aug 02 #Javascript
javascript 取小数点后几位几种方法总结
Aug 02 #Javascript
AngularJS实现页面跳转后自动弹出对话框实例代码
Aug 02 #Javascript
jQuery接受后台传递的List的实例详解
Aug 02 #jQuery
You might like
php从给定url获取文件扩展名的方法
2015/03/14 PHP
PHP版本升级到7.x后wordpress的一些修改及wordpress技巧
2015/12/25 PHP
php中照片旋转 (orientation) 问题的正确处理
2017/02/16 PHP
PHP单例模式简单用法示例
2017/06/23 PHP
读jQuery之七 判断点击了鼠标哪个键的代码
2011/06/21 Javascript
jQuery侧边栏随窗口滚动实现方法
2013/03/04 Javascript
js 文本滚动效果的实例代码
2013/08/17 Javascript
Javascript 绘制 sin 曲线过程附图
2014/08/21 Javascript
jQuery CSS3相结合实现时钟插件
2016/01/08 Javascript
Angular使用Md5加密的解决方法
2017/09/16 Javascript
JavaScript+H5实现微信摇一摇功能
2018/05/23 Javascript
vue.js配合$.post从后台获取数据简单demo分享
2018/08/11 Javascript
vue基于element-ui的三级CheckBox复选框功能的实现代码
2018/10/15 Javascript
Vue防止白屏添加首屏动画的实例
2019/10/31 Javascript
微信小程序如何实现点击图片放大功能
2020/01/21 Javascript
[04:52]2015国际邀请赛LGD战队晋级之路
2015/08/14 DOTA
[01:03:50]DOTA2-DPC中国联赛 正赛 CDEC vs DLG BO3 第二场 2月7日
2021/03/11 DOTA
Pyhthon中使用compileall模块编译源文件为pyc文件
2015/04/28 Python
python脚本设置超时机制系统时间的方法
2016/02/21 Python
Python学习笔记之open()函数打开文件路径报错问题
2018/04/28 Python
tensorflow 恢复指定层与不同层指定不同学习率的方法
2018/07/26 Python
python通过配置文件共享全局变量的实例
2019/01/11 Python
搞定这套Python爬虫面试题(面试会so easy)
2019/04/03 Python
python ffmpeg任意提取视频帧的方法
2020/02/21 Python
Python脚本如何在bilibili中查找弹幕发送者
2020/06/04 Python
使用OpenCV去除面积较小的连通域
2020/07/05 Python
6PM官网:折扣鞋、服装及配饰
2018/08/03 全球购物
美国羽绒床上用品第一品牌:Pacific Coast
2018/08/25 全球购物
银行优秀员工事迹
2014/02/06 职场文书
学雷锋活动总结范文
2014/04/25 职场文书
党的生日演讲稿
2014/09/10 职场文书
领导欢迎词致辞
2015/01/23 职场文书
学校推普周活动总结
2015/05/07 职场文书
Go语言-为什么返回值为接口类型,却返回结构体
2021/04/24 Golang
python爬取网页版QQ空间,生成各类图表
2021/06/02 Python
Django实现WebSocket在线聊天室功能(channels库)
2021/09/25 Python