用原生JavaScript实现jQuery的$.getJSON的解决方法


Posted in Javascript onMay 03, 2013

今天在写一DEMO,其中用到了jQuery的$.getJSON方法,写完后发现整个DEMO中用到jQuery中的就这一个地方,但要引入一个jQuery实在不划算,于是就自己实现了一个简单版的,基本可以满足需求,现分享出来:

var $ = {
    getJSON: function(url, params, callbackFuncName, callback){
        var paramsUrl ="",
            jsonp = this.getQueryString(url)[callbackFuncName];
        for(var key in params){
            paramsUrl+="&"+key+"="+encodeURIComponent(params[key]);
        }
        url+=paramsUrl;
        window[jsonp] = function(data) {
            window[jsonp] = undefined;
            try {
                delete window[jsonp];
            } catch(e) {}
            if (head) {
                head.removeChild(script);
            }
            callback(data);
        };
        var head = document.getElementsByTagName('head')[0];
        var script = document.createElement('script');
        script.charset = "UTF-8";
        script.src = url;
        head.appendChild(script);
        return true;
    },
    getQueryString: function(url) {
        var result = {}, queryString = (url && url.indexOf("?")!=-1 && url.split("?")[1]) || location.search.substring(1),
            re = /([^&=]+)=([^&]*)/g, m;
        while (m = re.exec(queryString)) {
            result[decodeURIComponent(m[1])] = decodeURIComponent(m[2]);
        }
        return result;
    }
};

调用DEMO如下:

var url = "http://xxx.xxx.xxx?callback=jsonp123";
var params = {
    a:1,
    b:2
};
$.getJSON(url, params, "callback", function(data){
    //todo
});

Javascript 相关文章推荐
Javascript valueOf 使用方法
Dec 28 Javascript
Input 特殊事件onpopertychange和oninput
Jun 17 Javascript
jquery弹出框的用法示例(一)
Aug 26 Javascript
jquery.cookie用法详细解析
Dec 18 Javascript
JavaScript预解析及相关技巧分析
Apr 21 Javascript
Bootstrap CSS组件之下拉菜单(dropdown)
Dec 17 Javascript
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 jQuery
JS实现简易的图片拖拽排序实例代码
Jun 09 Javascript
利用vscode调试编译后的js代码详解
May 14 Javascript
node 解析图片二维码的内容代码实例
Sep 11 Javascript
Paypal支付不完全指北
Jun 04 Javascript
微信小程序用户授权最佳实践指南
May 08 Javascript
基于KMP算法JavaScript的实现方法分析
May 03 #Javascript
JS动态获取当前时间,并写到特定的区域
May 03 #Javascript
JS实现商品倒计时实现代码
May 03 #Javascript
Javascript代码在页面加载时的执行顺序介绍
May 03 #Javascript
为什么要在引入的css或者js文件后面加参数的详细讲解
May 03 #Javascript
javascript两种function的定义介绍及区别说明
May 02 #Javascript
阻止子元素继承父元素事件具体思路及实现
May 02 #Javascript
You might like
php include的妙用,实现路径加密
2008/07/29 PHP
php中用加号与用array_merge合并数组的区别深入分析
2013/06/03 PHP
PHP面向对象精要总结
2014/11/07 PHP
PHP上传图片时判断上传文件是否为可用图片的方法
2016/10/20 PHP
php+redis实现注册、删除、编辑、分页、登录、关注等功能示例
2017/02/15 PHP
jQuery 技巧小结
2010/04/02 Javascript
div层的移动及性能优化
2010/11/16 Javascript
非常强大的 jQuery.AsyncBox 弹出对话框插件
2011/08/29 Javascript
完美实现仿QQ空间评论回复特效
2015/05/06 Javascript
JavaScript截取、切割字符串的技巧
2016/01/07 Javascript
理解javascript中的严格模式
2016/02/01 Javascript
JSP防止网页刷新重复提交数据的几种方法
2016/11/19 Javascript
selenium 与 chrome 进行qq登录并发邮件操作实例详解
2017/04/06 Javascript
浅谈Vue2.0中v-for迭代语法的变化(key、index)
2018/03/06 Javascript
关于微信公众号开发无法支付的问题解决
2018/12/28 Javascript
JS实现头条新闻的经典轮播图效果示例
2019/01/30 Javascript
vue elementUI table 自定义表头和行合并的实例代码
2019/05/22 Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
2019/07/07 Javascript
js使用文档就绪函数动态改变页面内容示例【innerHTML、innerText】
2019/11/07 Javascript
JavaScript实现图片伪异步上传过程解析
2020/04/10 Javascript
[48:41]VP vs VG Supermajor小组赛 B组胜者组决赛 BO3 第二场 6.2
2018/06/03 DOTA
python中使用urllib2伪造HTTP报头的2个方法
2014/07/07 Python
Python使用CMD模块更优雅的运行脚本
2015/05/11 Python
python3读取MySQL-Front的MYSQL密码
2017/05/03 Python
python数据结构之列表和元组的详解
2017/09/23 Python
python matplotlib 画dataframe的时间序列图实例
2019/11/20 Python
python pyecharts 实现一个文件绘制多张图
2020/05/13 Python
基于python调用jenkins-cli实现快速发布
2020/08/14 Python
解决Windows下python和pip命令无法使用的问题
2020/08/31 Python
百联网上商城:i百联
2017/01/28 全球购物
龟牌英国商店:Turtle Wax Brand Store UK
2019/07/02 全球购物
师范生个人推荐信
2013/11/29 职场文书
新三好学生主要事迹
2014/01/23 职场文书
2014年干部作风建设总结
2014/10/23 职场文书
承诺书范本
2015/01/21 职场文书
Android移动应用开发指南之六种布局详解
2022/09/23 Java/Android