JavaScript異步加載的4種方式

原文連接 - http://www.cnblogs.com/huangcong/p/3747038.html

方案1、$(document).ready()

• 須要引入jquery

• 兼容全部瀏覽器

$(document).ready(function() {
    alert("加載完成！");
});

方案2、<script>標籤的async="async"屬性

• async屬性是HTML5新增屬性，須要Chrome、FireFox、IE9+瀏覽器支持

• async屬性規定一旦腳本可用，則會異步執行

• async屬性僅適用於外部腳本

• 此方法不能保證腳本按順序執行

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

方案3、<script>標籤的defer="defer"屬性

• defer屬性規定是否對腳本執行進行延遲，直到頁面加載爲止

• 若是腳本不會改變文檔的內容，可將defer屬性加入到<script>標籤中，以便加快處理文檔的速度

• 兼容全部瀏覽器

• 此方法能夠確保全部設置了defer屬性的腳本按順序執行

方案4、動態建立<script>標籤

• 兼容全部瀏覽器

(function(){
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = "http://code.jquery.com/jquery-1.7.2.min.js";
    var tmp = document.getElementsByTagName('script')[0];
    tmp.parentNode.insertBefore(script, tmp);
})();

（完）