用原生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 相关文章推荐
splice slice区别
Oct 09 Javascript
javascript小组件 原生table排序表格脚本(兼容ie firefox opera chrome)
Jul 25 Javascript
javascript用户注册提示效果的简单实例
Aug 17 Javascript
在Firefox下js select标签点击无法弹出
Mar 06 Javascript
node.js中的path.sep方法使用说明
Dec 08 Javascript
DOM节点的替换或修改函数replaceChild()用法实例
Jan 12 Javascript
javascript中活灵活现的Array对象详解
Nov 30 Javascript
JS实现显示当前日期的实例代码
Jul 03 Javascript
JavaScript对象的浅拷贝与深拷贝实例分析
Jul 25 Javascript
JavaScript数据结构与算法之基本排序算法定义与效率比较【冒泡、选择、插入排序】
Feb 21 Javascript
JS实现点星星消除小游戏
Mar 24 Javascript
ajax jquery实现页面某一个div的刷新效果
Mar 04 jQuery
基于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中强制下载文件的代码(解决了IE下中文文件名乱码问题)
2011/05/09 PHP
谷歌音乐搜索栏的提示功能php修正代码
2011/05/09 PHP
PHP实现支持GET,POST,Multipart/form-data的HTTP请求类
2014/09/24 PHP
Yii2中SqlDataProvider用法示例
2016/09/22 PHP
新浪的图片新闻效果
2007/01/13 Javascript
由点击页面其它地方隐藏div所想到的jQuery的delegate
2013/08/29 Javascript
jQuery判断当前点击的是第几个li的代码
2014/09/26 Javascript
JavaScript实现大数的运算
2014/11/24 Javascript
jQuery仿gmail实现fixed布局的方法
2015/05/27 Javascript
javascript判断并获取注册表中可信任站点的方法
2015/06/01 Javascript
JS模式之简单的订阅者和发布者模式完整实例
2015/06/30 Javascript
AngularJS Module方法详解
2015/12/08 Javascript
JavaScript自动点击链接 防止绕过浏览器访问的方法
2017/01/19 Javascript
详解Vue2 SSR 缓存 Api 数据
2017/11/20 Javascript
ant design实现圈选功能
2019/12/17 Javascript
Vue的Eslint配置文件eslintrc.js说明与规则介绍
2020/02/03 Javascript
解决Vue router-link绑定事件不生效的问题
2020/07/22 Javascript
Python中zip()函数用法实例教程
2014/07/31 Python
Python基础学习之常见的内建函数整理
2017/09/06 Python
python虚拟环境迁移方法
2019/01/03 Python
通过shell+python实现企业微信预警
2019/03/07 Python
python3对拉勾数据进行可视化分析的方法详解
2019/04/03 Python
python安装numpy和pandas的方法步骤
2019/05/27 Python
在Python中字符串、列表、元组、字典之间的相互转换
2019/11/15 Python
Python 求数组局部最大值的实例
2019/11/26 Python
基于python判断目录或者文件代码实例
2019/11/29 Python
Django+boostrap 美化admin后台的操作
2020/03/11 Python
python使用OpenCV模块实现图像的融合示例代码
2020/04/10 Python
HTML5 input新增type属性color颜色拾取器的实例代码
2018/08/27 HTML / CSS
Wedgwood英国官方网站:英式精致骨瓷餐具、礼品与生活精品,源于1759年
2019/09/02 全球购物
戴尔新西兰官网:Dell New Zealand
2020/01/07 全球购物
Java基础知识面试要点
2016/07/29 面试题
Java程序开发中如何应用线程
2016/03/03 面试题
高中生的学习总结自我鉴定
2013/10/26 职场文书
教师的实习自我鉴定
2013/12/17 职场文书
工程承诺书怎么写
2014/05/24 职场文书