编程 Javascript

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

Posted in Javascript onNovember 08, 2013

直接看实例。
例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>

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

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

让div层随鼠标移动的实现代码 ie ff

Dec 18 Javascript

JavaScript之引用类型介绍

Aug 10 Javascript

ComboBox 和 DateField 在IE下消失的解决方法

Aug 30 Javascript

超详细的javascript数组方法汇总

Nov 21 Javascript

js中使用使用原型(prototype)定义方法的好处详解

Jul 04 Javascript

让html元素随浏览器的大小自适应垂直居中的实现方法

Oct 12 Javascript

bootstrap基础知识学习笔记

Nov 02 Javascript

jQuery中ajax错误调试分析

Dec 01 Javascript

Angular2使用Guard和Resolve进行验证和权限控制

Apr 24 Javascript

jQuery操作之效果详解

May 19 jQuery

vue中关闭eslint的方法分析

Aug 04 Javascript

webpack4 从零学习常用配置(小结)

May 28 Javascript

JQGrid的用法解析(列编辑,添加行,删除行)

Nov 08 #Javascript

jQuery 获取和设置select下拉框的值实现代码

Nov 08 #Javascript

jqGrid增加时--判断开始日期与结束日期(实例解析)

Nov 08 #Javascript

JavaScript中this的使用详解

Nov 08 #Javascript

jqGrid日期格式的判断示例代码(开始日期与结束日期)

Nov 08 #Javascript

JQuery验证jsp页面属性是否为空(实例代码)

Nov 08 #Javascript

原生js做的手风琴效果的导航菜单

Nov 08 #Javascript