用原生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之解决IE下不渲染的bug
Jun 29 Javascript
jQuery find和children方法使用
Jan 31 Javascript
Extjs优化(一)删除冗余代码提高运行速度
Apr 15 Javascript
实用的Jquery选项卡TAB示例代码
Aug 28 Javascript
js确认删除对话框效果的示例代码
Feb 20 Javascript
node.js中的http.response.removeHeader方法使用说明
Dec 14 Javascript
javascript实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
May 13 Javascript
jquery对Json的各种遍历方法总结(必看篇)
Sep 29 Javascript
vue 点击展开显示更多(点击收起部分隐藏)
Apr 09 Javascript
Vue使用NProgress的操作过程解析
Oct 10 Javascript
微信小程序页面间传递数组对象方法解析
Nov 06 Javascript
js将URL网址转为16进制加密与解密函数
Mar 04 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
德劲1104的电路分析与改良
2021/03/01 无线电
PHP抓取淘宝商品的用户晒单评论+图片+搜索商品列表实例
2016/04/14 PHP
php单例模式的简单实现方法
2016/06/10 PHP
php实现简单的权限管理的示例代码
2017/08/25 PHP
JXTree对象,读取外部xml文件数据,生成树的函数
2007/04/02 Javascript
鼠标移到导航当前位置的LI变色处于选中状态
2013/08/23 Javascript
JavaScript fontsize方法入门实例(按照指定的尺寸来显示字符串)
2014/10/17 Javascript
jQuery获取样式中颜色值的方法
2015/01/29 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
2015/10/29 Javascript
jquery特效 点击展示与隐藏全文
2015/12/09 Javascript
javascript数组去重小结
2016/03/07 Javascript
js选择器全面解析
2016/06/27 Javascript
js实现StringBuffer的简单实例
2016/09/02 Javascript
JavaScript微信定位功能实现方法
2016/11/29 Javascript
微信小程序常用简易小函数总结
2019/02/01 Javascript
[01:08:17]2018DOTA2亚洲邀请赛3月29日 小组赛B组 EG VS VGJ.T
2018/03/30 DOTA
python简单实现计算过期时间的方法
2015/06/09 Python
在Python的struct模块中进行数据格式转换的方法
2015/06/17 Python
python多维数组切片方法
2018/04/13 Python
基于随机梯度下降的矩阵分解推荐算法(python)
2018/08/31 Python
Python实例方法、类方法、静态方法的区别与作用详解
2019/03/25 Python
对pyqt5中QTabWidget的相关操作详解
2019/06/21 Python
Python 多个图同时在不同窗口显示的实现方法
2019/07/07 Python
Python: 传递列表副本方式
2019/12/19 Python
澳大利亚领先的在线机械五金、园艺和存储专家:Edisons
2018/03/24 全球购物
服务员岗位责任制
2014/02/11 职场文书
写自荐信的注意事项
2014/03/09 职场文书
2014年国庆节演讲稿
2014/09/19 职场文书
关于对大人不礼貌的检讨书
2014/09/29 职场文书
小学生作文批改评语
2014/12/25 职场文书
国博复兴之路观后感
2015/06/02 职场文书
详解Laravel制作API接口
2021/05/31 PHP
python tqdm用法及实例详解
2021/06/16 Python
十大经典日本动漫排行榜 海贼王第三,犬夜叉仅第八
2022/03/18 日漫
MySQL中EXPLAIN语句及用法
2022/05/20 MySQL
Android开发手册TextInputLayout样式使用示例
2022/06/10 Java/Android