javascript中動態(tài)加載js文件多種解決辦法總結(jié)
一個比較全部在動態(tài)加方法
/*
動態(tài)加載js v1.0 by:dum
用法:src="webJsBase.js?load=a,b"
注:加載本目錄下js
*/
var webJsBase = {
require: function(libraryName) {
document.write('<script type="text/javascript" src="'+libraryName+'"></script>');
},
load: function(defaultLoad) {
if((typeof Prototype=='undefined')||(typeof Element == 'undefined')||(typeof Element.Methods=='undefined'))
throw ('prototype lib 加載失?。?);
if(typeof defaultLoad=='undefined')defaultLoad='';
var js = /webJsBase.js(?.*)?$/;
$$('head script[src]').findAll(function(s) {
return s.src.match(js);
}).each(function(s) {
var path = s.src.replace(js, '');
var includes = s.src.match(/?.*load=([a-zA-Z0-9_,]*)/);
(includes ? includes[1] : defaultLoad).split(',').each(function(include) {
webJsBase.require(path + include + '.js');
});
});
}
};
webJsBase.load(); //這里參數(shù)可以指定默認要加載的js文件
這是最簡單的方法在加載完后再利用直接document.write 如下圖。
<script language="javascript">
document.write("<script src='test.js'></script>");
</script>
給script加個id再去動態(tài)改變已有script的src 屬性
<script src='' id="s1"></script>
<script language="javascript">
s1.src="test.js"
</script>
這里利用getElementsByTagName('HEAD')動態(tài)創(chuàng)建 script元素
<script>
var oHead = document.getElementsByTagName('HEAD').item(0);
var oScript= document.createElement("script");
oScript.type = "text/javascript";
oScript.src="test.js";
oHead.appendChild( oScript);
</script>
還可以這樣嘗試一下,自定一個函數(shù)
function include(src) {
HTMLCode = '<script language="javascript" src="' + src + '"></script>';
document.write(HTMLCode);
}
調(diào)用方法,這樣看上去就你php的include函數(shù)了
include(baseDir + "/Prototype.js");
include(baseDir + "/Map.js");
include(baseDir + "/MapEvent.js");
include(baseDir + "/model/MapModel.js");
include(baseDir + "/model/MapType.js");
include(baseDir + "/model/Tile.js");
還有朋友說可以使用ExtJs4 動態(tài)加載js這里我就不介紹了,上面的方法足夠讓你實現(xiàn)動態(tài)加載js了.
所以在采用這類方法動態(tài)加載Js 的同時,主界面的Js腳本是繼續(xù)執(zhí)行的,所以可能出現(xiàn)通過異步加載的Js代碼得不到預(yù)期的效果的情況。
這時候可以考慮采用Ajax加載Js的方法。
- 動態(tài)加載JS文件的三種方法
- jquery及js實現(xiàn)動態(tài)加載js文件的方法
- 用ajax動態(tài)加載需要的js文件
- 如何實現(xiàn)JavaScript動態(tài)加載CSS和JS文件
- JS 動態(tài)加載js文件和css文件 同步/異步的兩種簡單方式
- JS加載器如何動態(tài)加載外部js文件
- 使用javaScript動態(tài)加載Js文件和Css文件
- 理解javascript中的回調(diào)函數(shù)(callback)
- js 異步操作回調(diào)函數(shù)如何控制執(zhí)行順序
- javascript 自定義回調(diào)函數(shù)示例代碼
- 原生JS實現(xiàn)動態(tài)加載js文件并在加載成功后執(zhí)行回調(diào)函數(shù)的方法
相關(guān)文章
原生javascript實現(xiàn)的ajax異步封裝功能示例
這篇文章主要介紹了原生javascript實現(xiàn)的ajax異步封裝功能,結(jié)合完整實例形式分析了原生javascript實現(xiàn)的ajax異步交互函數(shù)與相應(yīng)的使用方法,需要的朋友可以參考下2016-11-11
用js實現(xiàn)的檢測瀏覽器和系統(tǒng)的函數(shù)
檢測各種瀏覽器、系統(tǒng)的JS代碼2009-04-04
javascript實現(xiàn)當(dāng)前頁導(dǎo)航激活的方法
這篇文章主要介紹了javascript實現(xiàn)當(dāng)前頁導(dǎo)航激活的方法,涉及javascript操作css的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-02-02

