如何使用原生JS實現動態加載js文件并在加載成功后執行回調函數的方法

這篇文章主要介紹如何使用原生JS實現動態加載js文件并在加載成功后執行回調函數的方法，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

JS是什么

JS是JavaScript的簡稱，它是一種直譯式的腳本語言，其解釋器被稱為JavaScript引擎，是瀏覽器的一部分，主要用于web的開發，可以給網站添加各種各樣的動態效果，讓網頁更加美觀。

具體如下：

有的時候需要動態加載一個javascript文件，并且在加載成功后執行回調函數（例如文件中保存了json數據之類的）。要實現這樣的功能，可以使用<script> 元素的load 事件（IE9+、chrome、FireFox等）和onreadystatechange 事件（IE8以下），直接上代碼：

function loadScript(src, callback) {
  var script = document.createElement('script'),
    head = document.getElementsByTagName('head')[0];
  script.type = 'text/javascript';
  script.charset = 'UTF-8';
  script.src = src;
  if (script.addEventListener) {
    script.addEventListener('load', function () {
      callback();
    }, false);
  } else if (script.attachEvent) {
    script.attachEvent('onreadystatechange', function () {
      var target = window.event.srcElement;
      if (target.readyState == 'loaded') {
        callback();
      }
    });
  }
  head.appendChild(script);
}

調用方法示例：

loadScript('http://cdn.staticfile.org/jquery/1.6.2/jquery.min.js',function(){
  console.log('onload');
});

運行后控制臺輸出onload，如下圖所示：

以上是“如何使用原生JS實現動態加載js文件并在加載成功后執行回調函數的方法”這篇文章的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！