这三种JS异步加载的方式，你必须掌握！

通常情况下javascript是默认同步加载的，也就是所说的javascript的加载时阻塞的，后面的页面要等到javascript加载结束后，才能再进行加载，这样对于一些意义不是很大的javascript来说，如果放在页头会导致加载很慢的话，会严重影响用户的体验度的。

异步加载又叫非阻塞加载，也就是说浏览器在下载执行js的同时，还能继续进行后续页面的处理。举个生活中的例子：同步：早上起床,先刷牙,然后烧水,等水烧开了再洗脸,之后再整理发型.异步：先刷牙,然后烧水,烧水同时整理发型,等水烧开后,再取刚烧开的水洗脸

异步加载通常有以下几种方式：

1、defer，

只支持IEdefer 属性规定是否对脚本执行进行延迟，需要等dom文档全部解析完毕才会被执行。

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

//行内js
<script type="text/javascript"  defer="defer">
console.log（“a”）；
</script>

2、async：async属性是HTML5中新增的异步支持，async 属性规定一旦脚本可用，加载完毕就会执行，但是async只能加载外部js脚本，不能把js书写在script标签内(W3C标准方法)

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

3.onload时的异步加载

创建script，插入到DOM中，加载完毕后callback

(function(){
	if(window.attachEvent){
    	window.attachEvent("load", asyncLoad);
    }else{
    	window.addEventListener("load", asyncLoad);
    }
    var asyncLoad = function(){
    	var ga = document.createElement('script'); 
        ga.type = 'text/javascript'; 
        ga.async = true; 
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
        var s = document.getElementsByTagName('script')[0]; 
        s.parentNode.insertBefore(ga, s);
    }
})();