JS异步加载
JS异步加载的三种形式
- defer (IE专属)
要等到dom文档全部解析完才会被执行
<script type="text/javascript" src="demo.js" defer="defer"> </script>
或者
<script defer="defer">
var a=123;
</script>
- async
加载完就执行, async只能加载外部脚本,不能把js写在标签内
<script type="text/javascript" src="demo.js" async="async"> </script>
3.创建script,插入到dom树中,加载完毕后callback
function scriptCreate(url,callback){
var script=document.createElement('script');
script.type="text/javascript";
if(script.readyState){
script.onreadystatechange=function(){ //ie
if(script.readyState=="complete"||script.readyState=="loaded"){
callback();
}
}
}else{
script.onload=function(){ //safari chrome firefox opera
callback();
}
}
script.src=url; //不放前面的原因是如果这个语句执行太快然后readystate变化的太快 没等事件绑定完就已经变化了 那就检测侧不到onreadystatechange的变化 那就执行不了函数。
document.head.appendChild(script);
}
scriptCreate("demo.js",function(){hello();}); //不能直接传hello();因为调用函数的时候还不知道hello这个函数是不是存在于script里面,所以会找不到hello,如果