异步加载JS几种方式

默认情况javascript是同步加载的,也就是javascript的加载时阻塞的,后面的元素要等待javascript加载完毕后才能进行再加载,对于一些意义不是很大的javascript,如果放在页头会导致加载很慢的话,是会严重影响用户体验的。

(1)defer -- 仅支持IE

异步加载,但要等到dom文档全部解析完才会被执行。

也可将代码写入内部。

(2)async 

异步加载,加载完即执行.

只能加载外部脚本,不能把JS写入内部。

 (3) 创建script,插入到DOM中,加载完毕后callBack

function loadScript(url, callback) {
            var script = document.createElement('script');  // 创建script标签
            // 如果存在script状态码为IE
            if (script.readyState) {//IE
                script.onreadystatechange = function () {
                    if (script.readyState == 'complete' || script.readyState == 'loaded') {
                        script.onreadystatechange = null;
                        callback();
                    }
                }
            } else {//Firefox, Safari, Chrome,  Opera 
                script.onload = function () {
                    rotate();
                }
            }
            script.src = url;
            document.head.appendChild(script);
        }

 

posted @ 2018-08-08 09:29  抱臂柴  阅读(152)  评论(0编辑  收藏  举报