【jsonp跨域原理】使用jsonp实现跨域获取数据实例讲解

js部分

(function(window, document) {   "use strict";   varjsonp =function(url, data, callback) {     //1、挂载回调函数     varfnsuffix = Math.random().toString().replace(".","");     varcbFuncName ="my_json_cb"+ fnsuffix;     window[cbFuncName] = callback;     //2、将data转换成url字符串的形式     //{id=1,count=4}==>id=1&count=4     varquerystring = url.indexOf("?") == -1 ?"?":"&";  //判断url中最后是否有？，没有则为？     for(varkeyindata) {       querystring += key +"="+ data[key] +"&";     }     //3、处理url中回调函数 url+=callback=sdgade     querystring +="callback="+ cbFuncName;     //querystring=?id=1&count=4&callback=sdgade     //4、创建一个script标签     varscriptElement = document.createElement("script");     scriptElement.src = url + querystring;     //5、把script标签放到页面上     document.body.appendChild(scriptElement);   };   window.$jsonp = jsonp; })(window, document)

在页面中测试

        <script type="text/javascript"src="http.js"></script>   <script>     (function(){       $jsonp("http://api.douban.com/v2/movie/in_theaters",{},          function(data){           document.getElementById("htt").innerHTML=JSON.stringify(data);         });     })()   </script>

结果可以返回结果，页面显示为，表示获取成功！

【jsonp跨域原理】使用jsonp实现跨域获取数据实例讲解

http://m.bbyears.com/wangyezhizuo/116952.html

推荐访问:ajax跨域jsonp