首页 > 代码库 > 网页图片很多时,加载完后再加载图片(defer:延迟加载)

网页图片很多时,加载完后再加载图片(defer:延迟加载)

图片影响页面加载速度,可以先加载完页面,再去加载图片。

defer:告诉浏览器,这里面的js代码不影响网页脚本解析,可以解析完html脚本再执行这段js代码(个人理解)。

网页代码:<img src="http://www.mamicode.com/grey.gif" data-original="img/53a1820f5866c.png"/>

Js代码:

<script defer="defer" type="text/javascript" >
      $(window).on("load",function(){
        var str=document.getElementsByTagName(‘img‘);
         for(var i=0;i<str.length;i++)//遍历内容块
            {
            str[i].setAttribute(‘src‘,str[i].getAttribute(‘data-original‘));
            }
      });
</script>

网页图片很多时,加载完后再加载图片(defer:延迟加载)