1、异步加载
1.1、异步加载js的三种方法1、defer 异步加载：加载后续文档元素的过程和JS的加载是并行进行（异步）的，但是JS的执行在所有元素解析完成之后进行，而且它是按照加载顺序执行脚本的

<script type="text/javascript" src="tool.js" defer="defer"></script>

2、aysnc ：加载和渲染后续文档的过程和当前JS的加载与执行并行进行（异步），它是乱序执行的，不管你声明的顺序如何，只要它加载完了就会执行

<script type="text/javascript" src="tool.js" async="async"></script>

3.动态生成

<script>
    function loadScript(url,callback) {        var script = document.createElement('script');        if(script.readyState){            script.onreadystatechange=function(){                if(script.readyState=='complete'||script.readyState=='loaded'){                    callback();                }            }        }else{            script.onload=function(){                callback();            }        }        script.src=url;        document.head.appendChild(script);    }    loadScript('00.js',function(){        test();    })</script>

2、js加载时间线
1、创建Document对象，开始解析web页面。这个阶段document.readyState=‘loading’;
2、遇到link外部css，创建线程加载，并继续解析文档
3、遇到script外部js，并且没有设置async，defer，浏览器加载，并阻塞，等待js加载完成并执行完该脚本，然后继续解析文档
4、遇到script外部js，并且设置有async，defer，浏览器创建线程加载，并继续解析文档；对于async属性的脚本，脚本加载完后立即执行（异步禁止使用documen.write()）
5、遇到img等，先正常解析dom结构，然后浏览器异步加载src，并继续解析文档
6、当文档解析完成，document.readyState=‘interactive’
7、文档解析完成后，所有设置defer的脚本会被按照顺序执行。（注意与async的不同，但同样禁止使用document.write()）
8、document对象触发DOMContentLoaded事件，这也标志着程序执行从同步脚本执行阶段，转化为事件驱动阶段
9、当所有async的脚本加载完成并执行后、img等加载完成后，document.readyState=‘complete’,window对象触发load事件
10、从此，以异步响应方式处理用户输入、网络事件等