首页 > 心得分享 > [鸡肋]原生JS代码实现简易JSONP功能.

[鸡肋]原生JS代码实现简易JSONP功能.

为什么说鸡肋呢,因为jQuery等JS类库已经提供了足够好用的各种调用方法.

所以,你几乎没有可能会有使用上这些代码的时候.

但是,你总会有不方便加载jQuery却还需要跨域获取数据的情况,那么,这个小代码就派上用场了;

压缩后代码

function jsonp(a,b){var c=document.createElement("script"),d="Qs5_Callback_"+(new Date).valueOf()+"_"+Math.random().toString().replace(".","");window.addEventListener?c.addEventListener("load",function(){document.body.removeChild(c)}):c.attachEvent("onload",function(){document.body.removeChild(c)}),window[d]=b,c.setAttribute("CallBackName",d),c.src=a+(a.indexOf("?")>0?"&":"?")+"callback="+d,document.body.appendChild(c)}

未压缩源代码

function jsonp(Url, Callback) {
    var scriptObj = document.createElement('script'),
        CallBackName = 'Qs5_Callback_' + (new Date()).valueOf() + '_' + Math.random().toString().replace('.','');
    if(window.addEventListener){
        scriptObj.addEventListener('load', function() { document.body.removeChild(scriptObj); });
    }else{
        scriptObj.attachEvent('onload', function() { document.body.removeChild(scriptObj); });
    }
    window[CallBackName] = Callback;
    scriptObj.setAttribute('CallBackName', CallBackName);
    scriptObj.src = Url + (Url.indexOf('?') > 0 ? '&' : '?') + 'callback=' + CallBackName;
    document.body.appendChild(scriptObj);
}

调用方法:

jsonp('http://www.baidu.com/data.php', function(data) {
    console.log(data);
})

代码很少,功能也很简单,但是应该足够使用了,没考虑浏览器兼容问题.见谅.

欢迎各路大神优化代码,谢谢.

PS:发现我最近好像光写JS代码了,说好的PHP呢?

上一篇: [JS]取不重复的随机数

下一篇: [PHP]循环递归创建文件夹

最近回复

标签