动态加载JS文件的三种方法

前端技术 2023/09/06 JavaScript
直接看实例。
例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\"\');//这个函数是在new.js里面的，当点击click后运行这个函数
});
});
});
</script>
</head>
<body>
<button type=\"button\" id=\"loadButton\">Load</button>
 

本文地址：https://www.stayed.cn/item/15194

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案