异步加载js
的实现,有三种方法:
defer
:规定是否对脚本执行进行延迟,但却是并行下载,要等到DOM
文档全部加载解析好了,才会被执行。只有IE
能用,也可以将代码写到内部,如下:
<script type="text/javascript" src="demo.js" defer="defer"></script>
async
:异步加载,加载好了就执行,不管页面是否解析好。async
只能加载外部脚本,不能把js
写在script
标签里(IE9以上都能执行,比较普遍)。如下:
<script type="text/javascript" src="demo.js" async="async"></script>
- 创建
script
,插入到DOM
中,加载完成后callBack
(这种形式的异步加载除了IE浏览器无法执行,其他都是可以的)。,如下:
function loadScript(url, callback){
var script = document.createElement_x("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" ||
script.readyState == "complete"){
script.onreadystatechange = null;
callback();
}
};
} else { //Others: Firefox, Safari, Chrome, and Opera
script.onload = function(){
callback();
};
}
script.src = url;
document.body.appendChild(script);
}