1、同步加载（阻塞加载）
只有当当前加载完后，才能进行下一步操作。
但是如果js中有输出document内容、修改dom等，则会造成页面阻塞，所以一般建议把<script>放在<body>结尾处
2、异步加载（非阻塞加载）
浏览器再下载执行js的同时，还会继续进行后续页面的处理
①onload时的异步加载
(function(){
if(window.attachEvent){
window.attachEvent("onload",asyncLoad);
}else{
window.addEventLister("load",asyncLoad);
}
var asyncLoad = function(){
var script = document.createElement("script");
script.type = "text/javascript";
script.async = true;
script.src = "";
var s = document.getElementsByName("script")[0];
s.parentNode.insertBefore(script,s);
}
})();
这种方法就是把插入的script的方法放在一个函数中，然后在window的onload方法中执行
②Script In Iframe
在父窗口中插入一个iframe元素，然后在iframe中执行加载JS的操作
var iframe = document.createElement("iframe");
document.body.appendChild(iframe);
var doc = iframe.contentWindow.document; //iframe.contentWindow：获取iframe的window属性
doc.open();
doc.write("<script> var insertJS = function(){alert(2);};<\/script><body onload = 'insertJS()'></body>");
doc.close();
③HTML5新属性：async和defer
defer：并行下载其他有defer属性的js，按照顺序执行
async：js将在下载完成后尽快执行，不能保证js顺序执行
④创建script标签，插入DOM中
3、延迟加载
有些js并不是在页面初始化时就需要，而是在某些情况才需要。
将js切分成许多模块，页面初始化时只加载需要立即执行的js，然后其他js的加载延迟到第一次需要的时候
js的加载分为两部分：下载和执行。异步加载只是解决了下载的问题，但是代码在下载后就会立即执行，在执行过程中浏览器处于阻塞状态，响应不了任何请求
解决思路：利用异步加载缓存起来，但是不立即执行，需要的时候在执行。将JS内容作为Image或者Object对象缓存起来，就不会立即执行。
①模拟较长的下载时间
利用thread让其sleep一段时间在执行下载操作
②模拟较长的JS代码执行时间
var start = Number(new Date());
while((start + 5000)>Number(new Date())){//执行js代码}
这段代码将使JS执行5秒才完成
1341
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
