欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

使用jsonp實現(xiàn)跨域獲取數(shù)據(jù)實例講解

 更新時間：2016年12月25日 10:45:58   作者：沛東  
這篇文章主要介紹了使用jsonp實現(xiàn)跨域獲取數(shù)據(jù)實例講解,需要的朋友可以參考下

js部分

(function(window, document) {
  'use strict';
  var jsonp = function(url, data, callback) {
    //1、掛載回調(diào)函數(shù)
    var fnsuffix = Math.random().toString().replace('.', '');
    var cbFuncName = 'my_json_cb' + fnsuffix;
    window[cbFuncName] = callback;
    //2、將data轉(zhuǎn)換成url字符串的形式
    //{id=1,count=4}==>id=1&count=4
    var querystring = url.indexOf('?') == -1 ? '?' : '&';   //判斷url中最后是否有？，沒有則為？
    for (var key in data) {
      querystring += key + '=' + data[key] + '&';
    }
    //3、處理url中回調(diào)函數(shù) url+=callback=sdgade
    querystring += 'callback=' + cbFuncName;
    //querystring=?id=1&count=4&callback=sdgade
    //4、創(chuàng)建一個script標(biāo)簽
    var scriptElement = document.createElement('script');
    scriptElement.src = url + querystring;
    //5、把script標(biāo)簽放到頁面上
    document.body.appendChild(scriptElement);
  };
  window.$jsonp = jsonp;
})(window, document)

在頁面中測試

<!DOCTYPE html>
<html>
<head>
  <title>jsonp</title>
</head>
<body>
  <div id="htt"></div>
  <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>
</body>
</html>

結(jié)果可以返回結(jié)果，頁面顯示為，表示獲取成功！

以上所述是小編給大家介紹的使用jsonp實現(xiàn)跨域獲取數(shù)據(jù)實例講解，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

相關(guān)文章

  • 一文詳解如何有效的處理Promise并發(fā)

    一文詳解如何有效的處理Promise并發(fā)

    這篇文章主要為大家介紹如何有效的處理Promise并發(fā)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
    2023-04-04
  • 微信小程序?qū)崿F(xiàn)隨機驗證碼

    微信小程序?qū)崿F(xiàn)隨機驗證碼

    這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)隨機驗證碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2022-05-05
  • 關(guān)于JS判斷圖片是否加載完成且獲取圖片寬度的方法

    關(guān)于JS判斷圖片是否加載完成且獲取圖片寬度的方法

    本篇文章小編為大家介紹，關(guān)于JS判斷圖片是否加載完成且獲取圖片寬度的方法，有需要的朋友可以參考一下
    2013-04-04
  • Javascript仿新浪游戲頻道鼠標(biāo)懸停顯示子菜單效果

    Javascript仿新浪游戲頻道鼠標(biāo)懸停顯示子菜單效果

    這篇文章主要介紹了Javascript仿新浪游戲頻道鼠標(biāo)懸停顯示子菜單效果,涉及鼠標(biāo)事件及頁面元素結(jié)點的遍歷技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-08-08
  • Javascript實現(xiàn)可旋轉(zhuǎn)的圓圈實例代碼

    Javascript實現(xiàn)可旋轉(zhuǎn)的圓圈實例代碼

    這篇文章主要介紹了Javascript實現(xiàn)可旋轉(zhuǎn)的圓圈實例代碼,可實現(xiàn)圓圈的旋轉(zhuǎn)與運動效果,涉及javascript動態(tài)操作頁面元素屬性及進(jìn)行相應(yīng)數(shù)學(xué)運算的技巧,需要的朋友可以參考下
    2015-08-08
  • D3.js入門之D3?DataJoin的使用

    D3.js入門之D3?DataJoin的使用

    DataJoin(數(shù)據(jù)連接)是D3中很重要的一個概念。D3是基于數(shù)據(jù)操作DOM的js庫，DataJoin使我們能夠根據(jù)現(xiàn)有?HTML?文檔中的數(shù)據(jù)集注入、修改和刪除元素。本文主要和大家詳細(xì)聊聊DataJoin的使用，感興趣的可以學(xué)習(xí)一下
    2022-11-11
  • ppk談JavaScript style屬性

    ppk談JavaScript style屬性

    JavaScript允許你改變站點的CSS表示層。如果想把用戶的眼球吸引到那些你希望他們關(guān)注的頁面元素上，改變樣式是極佳的（也是很普遍的）方式。
    2008-10-10
  • JS實現(xiàn)的五級聯(lián)動菜單效果完整實例

    JS實現(xiàn)的五級聯(lián)動菜單效果完整實例

    這篇文章主要介紹了JS實現(xiàn)的五級聯(lián)動菜單效果,結(jié)合完整實例形式分析了js多級聯(lián)動菜單的完整實現(xiàn)步驟,涉及JS數(shù)組遍歷、擴(kuò)展及元素節(jié)點操作相關(guān)技巧,需要的朋友可以參考下
    2017-02-02
  • Bootstrap框架安裝使用詳解

    Bootstrap框架安裝使用詳解

    這篇文章主要為大家詳細(xì)介紹了Bootstrap框架的安裝使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2017-01-01
  • svg動畫之動態(tài)描邊效果

    svg動畫之動態(tài)描邊效果

    本文主要介紹了svg實現(xiàn)的動態(tài)描邊效果，文中分享了兩個實例：1.一個簡單的線一點一點畫出來的效果；2.用同樣的原理畫一個“藍(lán)胖子”。具有很好的參考價值，下面跟著小編一起來看下吧
    2017-02-02

最新評論