JS add script tag to dynamically call script
//IE:
var script = document.createElement("script");
script.setAttribute("type","text/javascript");
script.onreadystatechange = function() {
if(this.readyState == "loaded" || this.readyState == "complete"){
alert("success!");
}
}
script.setAttribute("src",scripts[i]); //Opera、FF、Chrome等:
var script = document.createElement("script");
script.setAttribute("type","text/javascript");
script.onload = function() {
alert("done!");
}
script.setAttribute("src",scripts[i]);
/**
* 串联加载指定的脚本
* 串联加载[异步]逐个加载,每个加载完成后加载下一个
* 全部加载完成后执行回调
* @param array|string 指定的脚本们
* @param function 成功后回调的函数
* @return array 所有生成的脚本元素对象数组
*/ function seriesLoadScripts(scripts,callback) {
if(typeof(scripts) != "object") var scripts = [scripts];
var HEAD = document.getElementsByTagName("head").item(0) || document.documentElement;
var s = new Array(), last = scripts.length - 1, recursiveLoad = function(i) { //递归
s[i] = document.createElement("script");
s[i].setAttribute("type","text/javascript");
s[i].onload = s[i].onreadystatechange = function() { //Attach handlers for all browsers
if(!/*@cc_on!@*/0 || this.readyState == "loaded" || this.readyState == "complete") {
this.onload = this.onreadystatechange = null; this.parentNode.removeChild(this);
if(i != last) recursiveLoad(i + 1); else if(typeof(callback) == "function") callback();
}
}
s[i].setAttribute("src",scripts[i]);
HEAD.appendChild(s[i]);
};
recursiveLoad(0);
} /**
* 并联加载指定的脚本
* 并联加载[同步]同时加载,不管上个是否加载完成,直接加载全部
* 全部加载完成后执行回调
* @param array|string 指定的脚本们
* @param function 成功后回调的函数
* @return array 所有生成的脚本元素对象数组
*/ function parallelLoadScripts(scripts,callback) {
if(typeof(scripts) != "object") var scripts = [scripts];
var HEAD = document.getElementsByTagName("head").item(0) || document.documentElement, s = new Array(), loaded = 0;
for(var i=0; i<scripts.length; i++) {
s[i] = document.createElement("script");
s[i].setAttribute("type","text/javascript");
s[i].onload = s[i].onreadystatechange = function() { //Attach handlers for all browsers
if(!/*@cc_on!@*/0 || this.readyState == "loaded" || this.readyState == "complete") {
loaded++;
this.onload = this.onreadystatechange = null; this.parentNode.removeChild(this);
if(loaded == scripts.length && typeof(callback) == "function") callback();
}
};
s[i].setAttribute("src",scripts[i]);
HEAD.appendChild(s[i]);
}
}
Example: var scripts = [
"http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js",
"http://wellstyled.com/files/jquery.debug/jquery.debug.js"
]; //这两个文件分别是 jQuery 1.4.的库文件和 jQuery Debug 插件
//然后你可以使用下面的方法调用并在成功后执行回调了。 seriesLoadScripts(scripts,function(){ /*
debug = new $.debug({
posTo : { x:'right', y:'bottom' },
width: '480px',
height: '50%',
itemDivider : '<hr>',
listDOM : 'all'
}); */
alert('脚本加载完成啦');
}); 这里使用的是串联加载的函数,当然你也可以使用并联加载函数,这可以根据情况使用,建议每下一个脚本对上一个脚本有依赖性的使用串联加载,否则使用并联,因为原理上并联要比串联快那么些。
JS add script tag to dynamically call script的更多相关文章
- js,add script async? loaded ok.
function loadScript(url, callback){ var script = document.createElement_x("script") script ...
- HTML script tag type all in one
HTML script tag type all in one script type https://developer.mozilla.org/en-US/docs/Web/HTML/Elemen ...
- //string scriptstrs = "<script>alert('欢迎光临!');</script>";
//string scriptstrs = "<script>alert('欢迎光临!');</script>"; //if (!Page.ClientSc ...
- [LeetCode] 415. Add Strings_Easy tag: String
Given two non-negative integers num1 and num2 represented as string, return the sum of num1 and num2 ...
- <script>document.write(location.href)</script>
<script>document.write(location.href)</script> 什么意思?
- 深入比特币原理(四)——锁定脚本(locking script)与解锁脚本(unlocking script)
通常比特币都是以虚拟货币的概念出现在大众眼前,实际上比特币是第一个真正的区块链"平台",利用它去中心化.不可篡改.可追溯等特点不光可以实现多种交易模式(如点对点交易.多重签名交易等 ...
- 前端高质量知识(二)-JS执行上下文(执行环境)详细图解Script
先随便放张图 我们在JS学习初期或者面试的时候常常会遇到考核变量提升的思考题.比如先来一个简单一点的. console.log(a); // 这里会打印出什么? var a = 20; PS: 变量提 ...
- jquery add() 和js add()
HTML DOM add() 方法 HTML DOM Select 对象 定义和用法 add() 方法用于向 <select> 添加一个 <option> 元素. 语法 sel ...
- ASP.NET 动态创建文本框 TextBox (add TextBox to page dynamically)
下面的函数每执行一次就生成一个TextBox(其实是<input type="Text">) var i=0; function changeIt() ...
随机推荐
- k8s的service简述
k8s向集群外部暴露端口的3种方式: 1.service->nodePort :仅暴露一个宿主机端口,用于集群外部访问,因为此操作被写入各个节点的iptables或ipvs规则当中,可以用任意一 ...
- 零基础快速掌握Python系统管理视频课程【猎豹网校】
点击了解更多Python课程>>> 零基础快速掌握Python系统管理视频课程[猎豹网校] 课程目录 01.第01章 Python简介.mp4 02.第02章 IPython基础.m ...
- 【转】iPhone通讯录AddressBook.framework和AddressBookUI.framework的应用
通讯录中联系人相关的应用iPhone提供了两个框架:AddressBook.framework和AddressBookUI.framework,使用这两个框架我们可以在程序中访问并显示iPhone数据 ...
- Installing Apps Kattis - installingapps (贪心 + 背包)
Installing Apps Kattis - installingapps Sandra recently bought her first smart phone. One of her fri ...
- itchat 总结(转)
python实现微信接口(itchat) 安装 sudo pip install itchat 登录 itchat.auto_login() 这种方法将会通过微信扫描二维码登录,但是这种登录的方式确实 ...
- 在 Amazon AWS 搭建及部署网站:序
最近玩了把 AWS,实现了服务器的创建.PHP+MySql运行环境.代码部署等.一方面,后面的项目会反复重复这个流程,需要一份手册,另一方面,也给自己一个记录.于是把整个过程和要点整理一下,发到自己的 ...
- 设计模式之第13章-职责链模式(Java实现)
设计模式之第13章-职责链模式(Java实现) “请假都那么麻烦,至于么.”“咋的了?”“这不快过年了么,所以我想早两天回去,准备一下,买买东西什么的,然后去给项目经理请假,但是他说快过年了,所以这个 ...
- 使用 CommandScene 类在 XNA 中创建命令场景(十二)
平方已经开发了一些 Windows Phone 上的一些游戏,算不上什么技术大牛.在这里分享一下经验,仅为了和各位朋友交流经验.平方会逐步将自己编写的类上传到托管项目中,没有什么好名字,就叫 WPXN ...
- Python基础-week06 面向对象编程基础
一.面向对象编程 1.面向过程 与 面向对象编程 面向过程的程序设计: 核心是 过程二字,过程指的是解决问题的步骤,即先干什么再干什么......面向过程的设计就好比精心设计好一条流水线,是一种机械式 ...
- 【Appnium+C#+Winform自动化测试系列】一、获取本机连接的设备、启动多个Appnium和获取本机启动的Appnium
本系列内容,准备根据所完成的项目为基线,一步一步的把整个设计和实现过程梳理. 先从基本的一些环境问题入手,梳理清楚关于手机设备和Appnium.因为我们在后面的建立Appnium连接时,需要设备名字和 ...