加载外部 js 的方法大致有这么几种：
方法 | 说明 |
XHR Eval | 通过 Ajax 方式获取代码，并通过 eval 方式执行代码。 |
XHR Injection | 通过 Ajax 方式获取代码，并在页面上创建一个 script 元素，将 Ajax 取得的代码注入。 |
Script in Iframe | 通过 iframe 加载 js。 |
Script DOM Element | 使用 JavaScript 动态创建 script DOM 元素并设置其 src 属性。 |
Script Defer/Async | 严格来说，这一条不算是动态加载外部脚本的方法，但很多动态加载外部脚本的方法里都会用到 sctipt 的 defer 或 async 属性，所以也把它单独列在这儿。这个方法利用 script 的 defer 属性，让脚本“推迟”执行，不阻塞页面加载，或者设置 async 属性，让脚本异步执行。遗憾的是这两个属性不是所有浏览器都支持。 |
document.write Script Tag | 通过 document.write 把 HTML 标签 script 写入到页面中。 |
cache trick | 先使用自定义的 script 的 type 属性（如 <script type="text/cache" ...），甚至使用 Image、Object 等 HTML 对象将 js “预下载”（下载到浏览器缓存里），等真正需要执行对应代码时再将它真正地插入页面中。 |
Web Worker | 部分浏览器支持 web worker 功能，可以创建一个 worker 在后台工作，包括加载外部脚本。 |
LABjs方法
参数值为：
AlwaysPreserveOrder一个布尔值(默认值为false),控制是否一个隐式空wait()调用假定每个脚本加载后,基本上所有的脚本在链条部队执行串行顺序(加载并联,默认情况下,不受此设置)。
UseLocalXHR 一个布尔值(默认值为true)用ajax XHR来预加载脚本
AllowDuplicates
一个布尔值(缺省为false)控制LABjs是否会检查其内部脚本URL缓存以防止脚本URI被(不小心,很可能)加载一次。默认情况下,LABjs不会让任何重复请求相同的脚本的URL。
BasePath 本地脚本的基本路径
CacheBust一个布尔值(缺省为false)增加了一个随机数字参数,防止每个脚本的URL从你的请求的URL缓存取
Debug 布尔值，用于web控制台将记录$LAB各个步骤的加载/处理逻辑,这个属性只有在引入LABjs源码或者 LAB-debug.min.js文件后才生效
$LAB.setOptions()
设置一个或多个选项只有在影响当前$LAB正在执行链，此方法必须是$LAB链第一个执行方法。参数和setGlobalDefaults()一样。格式为：$LAB.setOptions({...}).script(...)...
$LAB.script() 加载脚本
传递参数：
string 一个相对或者绝对的script地址
object对象 包含如下属性：
src script文件的位置
type指定类型 ("text/javascript", "text/vbscript")
charset指定字符编码
array数组
function函数 如果一个函数是发现作为参数之一,该函数将会被立即执行,必须直接返回一个值。返回值必须是另一个容许类型(字符串、对象或数组)。如果函数调用的结果在任何返回值(“未定义”)或值是“falsy”(false,空等),它将被视为没有脚本加载
$LAB.wait()
这个函数有两个目的。
首先,插入到链,以确保所有脚本之前列出的链应该执行完后继续余下的部分的链。
其次,你可以指定一个函数参考(通常一个内联匿名函数),将按顺序执行的,紧跟着链条之前的脚本执行。
$LAB.queueScript()
把加载的script放到队列里边
$LAB.queueWait()
把执行的函数放到队列列表
$LAB.runQueue()
执行队列里的queueScript()和queueWait()
$LAB.noConflict()
防止$LAB占用
$LAB.sandbox()
sandbox()创建一个新的干净的$LAB。这允许您获取新实例的实验室,比如如果你需要一个新的队列使用queueWai()或 queueScript()。
例子：
例子1：
$LAB.script("script1.js")
.script("script2.js")
.script("script3.js")
.wait(function(){ // 等待所有的脚本执行完毕后才执行下面函数
script1Func();
script2Func();
script3Func();
});
$LAB
.script({ src: "script1.js", type: "text/javascript" })
.script("script2.js")
.script("script3.js")
.wait(function(){ // 等待所有的脚本执行完毕后才执行下面函数
script1Func();
script2Func();
script3Func();
});
$LAB
.script("script1.js", "script2.js", "script3.js")
.wait(function(){ // 等待所有的脚本执行完毕后才执行下面函数
script1Func();
script2Func();
script3Func();
});
$LAB
.script( [ "script1.js", "script2.js" ], "script3.js")
.wait(function(){ // 等待所有的脚本执行完毕后才执行下面函数
script1Func();
script2Func();
script3Func();
});
$LAB
.script("script1.js").wait() // 空wait() 只是简单确定执行顺序
.script("script2.js") // script2和script3依赖script1，必须让script1先执行，而script2和script3没有具体执行顺序
.script("script3.js").wait() // 空wait() 只是简单确定执行顺序
.script("script4.js") // 依赖script1, script2 和 script3，这3个先加载
.wait(function(){script4Func();});//执行脚本4函数
$LAB
.script("script1.js") // script1, script2, 和 script3互补依赖所以没有执行顺序,
.script("script2.js")
.script("script3.js")
.wait(function(){
//执行wait(...) 里的函数functions
alert("Scripts 1-3 are loaded!");
})
.script("script4.js") // 依赖script1, script2 and script3
.wait(function(){script4Func();});
例子7：
$LAB
.setOptions({AlwaysPreserveOrder:true}) //设置每个脚本进行等待wait,即每个脚本彼此依赖
.script("script1.js") // script1, script2, script3, and script4 *DO* depend on each
.script("script2.js") // other, and will execute serially in order after all 4 have have
.script("script3.js") // loaded in parallel
.script("script4.js")
.wait(function(){script4Func();});
$LAB
.script(function(){
// assuming `_is_IE` defined by host page as true in IE and false in other browsers
if (_is_IE) {
return "ie.js"; // only if in IE, this script will be loaded
}
else {
return null; // if not in IE, this script call will effectively be ignored
}
})
.script("script1.js")
.wait();
$LAB
.queueScript("script1.js") // script1, script2, and script3彼此不依赖所以按照任意顺序执行
.queueScript("script2.js")
.queueScript("script3.js")
.queueWait(function(){
//执行wait(...) 函数functions
alert("Scripts 1-3 are loaded!");
})
.queueScript("script4.js") // 依赖 script1, script2 and script3
.queueWait(function(){script4Func();});//执行函数4
// ...
$LAB
.runQueue() // 执行队列$LAB链
.script("script5.js")
.wait(function(){
alert("Script 5 loaded and executed off the end of a previously queued chain.");
});
官网文档
http://labjs.com/documentation.php
