動態(tài)加載JS文件的三種方法
更新時間:2013年11月08日 10:07:58 作者:
動態(tài)加載JS文件的三種方法
直接看實例。
例1 重新加載js文件
function loadJs(file) {
var head = $("head").remove("script[role='reload']");
$("<scri" + "pt>" + "</scr" + "ipt>").attr({ role: 'reload', src: file, type: 'text/javascript' }).appendTo(head);
}
例2 重新載入javascript文件的方法(給js定個id),自己封裝成一個方法方便大家使用:
function reloadAbleJSFn(id,newJS)
{
var oldjs = null;
var t = null;
var oldjs = document.getElementById(id);
if(oldjs) oldjs.parentNode.removeChild(oldjs);
var scriptObj = document.createElement("script");
scriptObj.src = newJS;
scriptObj.type = "text/javascript";
scriptObj.id = id;
document.getElementsByTagName("head")[0].appendChild(scriptObj);
}
例3 jquery的就直接使用getScript就可以了。
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript">
$(function()
{
$('#loadButton').click(function(){
$.getScript('new.js',function(){
newFun('"Checking new script"');//這個函數(shù)是在new.js里面的,當(dāng)點擊click后運行這個函數(shù)
});
});
});
</script>
</head>
<body>
<button type="button" id="loadButton">Load</button>
例1 重新加載js文件
復(fù)制代碼 代碼如下:
function loadJs(file) {
var head = $("head").remove("script[role='reload']");
$("<scri" + "pt>" + "</scr" + "ipt>").attr({ role: 'reload', src: file, type: 'text/javascript' }).appendTo(head);
}
例2 重新載入javascript文件的方法(給js定個id),自己封裝成一個方法方便大家使用:
復(fù)制代碼 代碼如下:
function reloadAbleJSFn(id,newJS)
{
var oldjs = null;
var t = null;
var oldjs = document.getElementById(id);
if(oldjs) oldjs.parentNode.removeChild(oldjs);
var scriptObj = document.createElement("script");
scriptObj.src = newJS;
scriptObj.type = "text/javascript";
scriptObj.id = id;
document.getElementsByTagName("head")[0].appendChild(scriptObj);
}
例3 jquery的就直接使用getScript就可以了。
復(fù)制代碼 代碼如下:
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript">
$(function()
{
$('#loadButton').click(function(){
$.getScript('new.js',function(){
newFun('"Checking new script"');//這個函數(shù)是在new.js里面的,當(dāng)點擊click后運行這個函數(shù)
});
});
});
</script>
</head>
<body>
<button type="button" id="loadButton">Load</button>
您可能感興趣的文章:
- 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文件多種解決辦法總結(jié)
- 使用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中檢測數(shù)據(jù)類型的四種方法
這篇文章主要給大家分享的是JavaScript中檢測數(shù)據(jù)類型的四種方法,有 typeof、instanceof、constructor、Object.prototype.toString.call(),下面文章詳細介紹內(nèi)容,需要的小伙伴可以參考一下2022-01-01JavaScript封閉函數(shù)及常用內(nèi)置對象示例
這篇文章主要介紹了JavaScript封閉函數(shù)及常用內(nèi)置對象,結(jié)合實例形式分析了JavaScript封閉函數(shù)及常用內(nèi)置對象的定義與簡單使用相關(guān)操作技巧,需要的朋友可以參考下2019-05-05使用JS location實現(xiàn)搜索框歷史記錄功能
這篇文章主要介紹了使用JS location實現(xiàn)搜索框歷史記錄功能,本文通過實例 代碼講解的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2019-12-12