js特点：单线程异步 （其实就是多线程，只是说用异步的方式表现出来了而已）
同步的会阻塞代码，在html中，只有script标签中的src会阻塞代码，可以通过defer属性和async属性进行解决
JavaScript的异步加载：异步加载又叫非阻塞加载，浏览器在下载执行js的同时，还会继续进行后续页面的处理。主要有三种方式。
第一种：defer 只针对IE浏览器
<script type="text/javascript" defer></script>
第二种：async 只能加载src中的脚本，不能把代码也在script标签中
<script type="text/javascript" src="xxx.js" async="async"></script>
下面这种写法是错误的
<script async="async" src="03.js"> var abc = 123; //不能这样写 </script>
第三种：动态添加script标签
<body> <script> function asyncScript(url,callback){ var script = document.createElement("script");//新建一个script标签 // div.onclick = function(){} 先绑定事件，然后再点击 if(script.readyState){ script.onreadystatechange = function(){ //script.readyState发生改变时触发script.onreadystatechange if(script.readyState == "complete" || script.readyState == "loaded"){ callback() } } }else{ script.onload = function(){//script.onload-->表示加载完成以后执行 callback() } } script.src = url; //参数传递进来 src加载url是一个异步的过程 // document.head.appendChild(script);//IE7和IE5上document没有head的DOM对象属性。 var head = document.getElementsByTagName("head")[0]; head.appendChild(script); }
asyncScript("test.js",function(){ test() }) </script> </body>