用原生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日期对象的dateAdd与dateDiff方法
Nov 18 Javascript
一款基于jQuery的图片场景标注提示弹窗特效
Jan 05 Javascript
JQuery中上下文选择器实现方法
May 18 Javascript
详解JavaScript中的客户端消息框架设计原理
Jun 24 Javascript
jquery之别踩白块游戏的简单实现
Jul 25 Javascript
JS实现简单的二元方程计算器功能示例
Jan 03 Javascript
jQuery实现动态文字搜索功能
Jan 05 Javascript
原生js封装自定义滚动条
Mar 24 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
Jul 24 Javascript
node.js操作MongoDB的实例详解
Oct 11 Javascript
vue中如何动态绑定图片,vue中通过data返回图片路径的方法
Feb 07 Javascript
Vue 中文本内容超出规定行数后展开收起的处理的实现方法
Apr 28 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下实现农历日历的代码
2007/03/07 PHP
浅析PHP程序防止ddos,dns,集群服务器攻击的解决办法
2013/06/18 PHP
解析php通过cookies获取远程网页的指定代码
2013/06/25 PHP
PHP关于IE下的iframe跨域导致session丢失问题解决方法
2013/10/10 PHP
PHP中遇到的时区问题解决方法
2015/07/23 PHP
php 浮点数比较方法详解
2017/05/05 PHP
Laravel 读取 config 下的数据方法
2019/10/13 PHP
JavaScript中的其他对象
2008/01/16 Javascript
了解一点js的Eval函数
2012/07/26 Javascript
Android中的jQuery:AQuery简介
2014/05/06 Javascript
Node.js 学习笔记之简介、安装及配置
2015/03/03 Javascript
基于jQuery仿淘宝产品图片放大镜代码分享
2020/06/23 Javascript
深入浅析同源策略和跨域访问
2015/11/26 Javascript
JS拖拽组件学习使用
2016/01/19 Javascript
Bootstrap3 Grid system原理及应用详解
2016/09/30 Javascript
JS实现图片预加载之无序预加载功能代码
2017/05/12 Javascript
荐书|您有一份JavaScript书单待签收
2017/07/21 Javascript
对node.js中render和send的用法详解
2018/05/14 Javascript
在vue中解决提示警告 for循环报错的方法
2018/09/28 Javascript
Python实现登陆文件验证方法
2018/10/06 Python
Numpy之random函数使用学习
2019/01/29 Python
Python自定义函数计算给定日期是该年第几天的方法示例
2019/05/30 Python
解决python多行注释引发缩进错误的问题
2019/08/23 Python
python-tornado的接口用swagger进行包装的实例
2019/08/29 Python
pytorch实现特殊的Module--Sqeuential三种写法
2020/01/15 Python
解决tensorflow/keras时出现数组维度不匹配问题
2020/06/29 Python
中国跨境电商:Tomtop
2017/03/16 全球购物
英国排名第一的在线宠物用品商店:Monster Pet Supplies
2018/05/20 全球购物
英国领先的在线礼品店:Getting Personal
2019/09/24 全球购物
一道写SQL的面试题和答案
2013/11/19 面试题
下面代码从性能上考虑,有什么问题
2015/04/03 面试题
物流管理专业大学生自荐信
2013/10/04 职场文书
大四学生思想汇报
2014/01/13 职场文书
护林防火标语
2014/06/27 职场文书
我的收音机情缘
2022/04/05 无线电
Python 统计序列中元素的出现频度
2022/04/26 Python