html 动态加载 JS文件

最新推荐文章于 2024-08-05 11:54:10 发布

chengmodelong

最新推荐文章于 2024-08-05 11:54:10 发布

阅读量3k

点赞数

分类专栏： .NET 文章标签： html js

本文链接：https://blog.csdn.net/chengmodelong/article/details/43985051

版权

.NET 专栏收录该内容

79 篇文章 0 订阅

订阅专栏

例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

function loadDemo(objSrc) {
var iHead = document.getElementsByTagName('HEAD').item(0);
var iScript = document.createElement("script");
iScript.type = "text/javascript";
iScript.src = objSrc;
iHead.appendChild(iScript);

}

JS 调用

loadDemo("js文件调用路径");

例4 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"');//这个函数是在new.js里面的，当点击click后运行这个函数
});
});
});
</script>
</head>
<body>
<button type="button" id="loadButton">Load</button>