如何判斷js檔案是否載入完畢

admin發表於2017-04-12

在實際應用中,我們可能會根據需要來引入外部js檔案,以達成想要的效果。

但是這個效果需要在js檔案載入完畢以後才能夠去實現,這時候就有可能需要讓我們去判斷js檔案是否載入完畢。

先看一段程式碼例項:

[JavaScript] 純文字檢視 複製程式碼
function include_js(file) {
  var _doc = document.getElementsByTagName('head')[0];
  var js = document.createElement('script');
  js.setAttribute('type', 'text/javascript');
  js.setAttribute('src', file);
  _doc.appendChild(js);
  if (!/*@cc_on!@*/0) { //if not IE
    js.onload = function () {
      console.log("檔案載入完畢");
    }
  } else {
    js.onreadystatechange = function () {
      if (js.readyState == 'loaded' || js.readyState == 'complete') {
        console.log("檔案載入完畢");
      }
    }
  }
  return false;
}
include_js('http://www.softwhy.com/mytest/jQuery/jquery-1.8.3.js');

上面的程式碼實現了載入完畢後的判斷功能,下面簡單對程式碼做一下說明。

在IE7以上和其他標準瀏覽器可以使用onload事件來判斷js檔案是否載入完畢,但是IE7和IE7以下瀏覽器中,<script>不支援onload事件,需要使用onreadystatechange事件來替代。

[JavaScript] 純文字檢視 複製程式碼
if (!/*@cc_on!@*/0)

上面的語句能夠判斷非IE瀏覽器(準確的說只能夠判斷到IE10)。

相關文章