判斷腳本加載是否完成的方法
更新時間：2009年05月26日 02:08:43 作者：
在“按需加載”的需求中，我們經(jīng)常會判斷當(dāng)腳本加載完成時，返回一個回調(diào)函數(shù)，那如何去判斷腳本的加載完成呢？
我們可以對加載的 JS 對象使用 onload 來判斷（js.onload），此方法 Firefox2、Firefox3、Safari3.1+、Opera9.6+ 瀏覽器都能很好的支持，但 IE6、IE7 卻不支持。曲線救國 —— IE6、IE7 我們可以使用 js.onreadystatechange 來跟蹤每個狀態(tài)變化的情況（一般為 loading 、loaded、interactive、complete），當(dāng)返回狀態(tài)為 loaded 或 complete 時，則表示加載完成，返回回調(diào)函數(shù)。
對于 readyState 狀態(tài)需要一個補充說明：
1.在 interactive 狀態(tài)下，用戶可以參與互動。
2.Opera 其實也支持 js.onreadystatechange，但他的狀態(tài)和 IE 的有很大差別。
具體實現(xiàn)代碼如下：
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
//Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload
js.onload = function () {
alert('Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload');
}
} else {
//IE6、IE7 support js.onreadystatechange
js.onreadystatechange = function () {
if (js.readyState == 'loaded' || js.readyState == 'complete') {
alert('IE6、IE7 support js.onreadystatechange');
}
}
}
return false;
}
//execution function
include_js('http://img.jb51.net/jslib/jquery/jquery-1.3.2.min.js);
對于 readyState 狀態(tài)需要一個補充說明：
1.在 interactive 狀態(tài)下，用戶可以參與互動。
2.Opera 其實也支持 js.onreadystatechange，但他的狀態(tài)和 IE 的有很大差別。
具體實現(xiàn)代碼如下：
復(fù)制代碼 代碼如下:
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
//Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload
js.onload = function () {
alert('Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload');
}
} else {
//IE6、IE7 support js.onreadystatechange
js.onreadystatechange = function () {
if (js.readyState == 'loaded' || js.readyState == 'complete') {
alert('IE6、IE7 support js.onreadystatechange');
}
}
}
return false;
}
//execution function
include_js('http://img.jb51.net/jslib/jquery/jquery-1.3.2.min.js);
相關(guān)文章
微信小程序?qū)崿F(xiàn)事件傳參與數(shù)據(jù)同步流程詳解
這篇文章主要介紹了微信小程序開發(fā)中實現(xiàn)事件傳參與數(shù)據(jù)同步的詳細(xì)流程，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧2022-10-10
這篇文章主要介紹了送你43道JS面試題,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-06-06
這篇文章主要介紹了javascript強制點擊廣告的方法,可用于下載站或文檔顯示站,實現(xiàn)點擊后才能出現(xiàn)相應(yīng)顯示的功能,非常具有實用價值,需要的朋友可以參考下2015-02-02
通過修改360搶票的刷新頻率和突破8車次限制實現(xiàn)方法
這篇文章主要介紹了通過修改360搶票的刷新頻率和突破8車次限制實現(xiàn)方法的相關(guān)資料,現(xiàn)在刷票工具很多，這里就舉一例修改，增加搶票頻率及突破8車次限制，需要的朋友可以參考下2017-01-01
本文通過實例代碼給大家介紹了js同時按下兩個方向鍵的實現(xiàn)方法，感興趣的朋友跟隨腳本之家小編一起看看吧2007-12-12
本文主要介紹了js利用正則表達(dá)式驗證密碼強度的實例，具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03
JavaScript將字符串轉(zhuǎn)換為整數(shù)的方法
這篇文章主要介紹了JavaScript將字符串轉(zhuǎn)換為整數(shù)的方法,涉及javascript中parseInt函數(shù)的使用技巧,非常具有實用價值,需要的朋友可以參考下2015-04-04
webpack+vue-cil中proxyTable處理跨域的方法
這篇文章主要介紹了webpack+vue-cil中proxyTable處理跨域的方法,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
ES6中引入了一些新的數(shù)組方法,例如:Array.of(),Array.from()等,下面這篇文章主要給大家介紹了關(guān)于es6處理數(shù)組的方法匯總,需要的朋友可以參考下2023-06-06
本篇文章主要介紹了Bootstrap提示框效果的實例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-07-07