这篇文章主要介绍了Lab.js初次使用笔记,本文对比了普通动态加载JS文件的技术和使用Lab.js加载JS文件的技术,并给出了Lab.js加载示例,需要的朋友可以参考下
动态加载JS函数
一般性的，当我们需要加载js文件的时候都会使用script标签来实现，类似于如下代码：
复制代码 代码如下:
但是直接使用script标签来加载js文件会有如下一些缺点：
1.严格的读取顺序。由于浏览器按照
如果我们使用LAB.js的话，要实现上述代码功能，则使用如下方式
复制代码 代码如下:
可以同时运行多条$LAB链，但是它们之间是完全独立的，不存在次序关系。如果你要确保一个Javascript文件在另一个文件之后运行，你只能把它们写在同一个链操作之中。只有当某些脚本是完全无关的时候，你才应该考虑把它们分成不同的$LAB链，表示它们之间不存在相关关系。
一般性的使用示例
复制代码 代码如下:
$LAB
.script("script1.js") // script1, script2, and script3 相互不依赖, 可以按照任意的顺序执行
.script("script2.js")
.script("script3.js")
.wait(function(){
alert("Scripts 1-3 are loaded!");
})
.script("script4.js") //必须等待script1.js,script2.js,script3.js执行完毕之后才能执行
.wait(function(){script4Func();});
复制代码 代码如下:
$LAB
.script("script.js")
.script({ src: "script1.js", type: "text/javascript" })
.script(["script1.js", "script2.js", "script3.js"])
.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
}
})
在控制台看LAB.js的加载信息
如果你想调试或者说在控制台看各个js加载信息的话，可以使用$LAB.setGlobalDefaults 方法,具体使用请看代码示例。
复制代码 代码如下:
以上就是Lab.js初次使用笔记的详细内容，更多请关注0133技术站其它相关文章！
