js延迟加载

  1. defer 属性

    
    

浏览器会并行下载 a.js和其它有defer属性的script,而不会阻塞页面后续处理。defer属性在IE 4.0中就实现了,超过10多年了!Firefox从 3.5 开始支持defer属性 。
注:所有的defer脚本保证是按顺序依次执行的。

  1. async 属性

     
    

async属性是HTML5新增的。作用和defer类似,但是它将在下载后尽快执行,不能保证脚本会按顺序执行。它们将在onload 事件之前完成。
Firefox3.6、Opera10.5、IE9和最新的Chrome 和 Safari 都支持 async属性。可以同时使用 async和defer,这样IE4之后的所有IE都支持异步加载。

  1. 动态创建DOM方式
  2. 用jQuery的getScript()方法
    $.getScript("outer.js",function(){//回调函数,成功获取文件后执行的函数
    console.log("脚本加载完成")
    });
  3. 图片懒加载
    function aftLoadImg(obj,url){
    var oImg = new Image();//缓冲
    oImg.onload = function(){
    obj.src = oImg.src;//图片加载完成后赋值给真正的图片元素
    }
    oImg.src = url;
    }

你可能感兴趣的:(js延迟加载)