首先,将模板中<img src=”"/>全部改为<img imgsrc=”"/>
然后在模板底部加上js代码:
<script>
function lazyloadimg(){
imgs=document.getElementsByTagName(“img”);
imgsnum=imgs.length;
for(i=0;i<imgsnum;i++){
if((typeof(imgs[i].src)==’undefined’||imgs[i].src==”)&&imgs[i].getAttribute(‘imgsrc’)!=null){
imgs[i].src=imgs[i].getAttribute(‘imgsrc’);
}
}
}
lazyloadimg();
</script>
然后在模板底部加上js代码:
<script>
function lazyloadimg(){
imgs=document.getElementsByTagName(“img”);
imgsnum=imgs.length;
for(i=0;i<imgsnum;i++){
if((typeof(imgs[i].src)==’undefined’||imgs[i].src==”)&&imgs[i].getAttribute(‘imgsrc’)!=null){
imgs[i].src=imgs[i].getAttribute(‘imgsrc’);
}
}
}
lazyloadimg();
</script>
本文介绍了一种通过修改HTML模板和使用JavaScript实现的懒加载技术来优化网页图片加载的方法。该方法能够提高页面加载速度,改善用户体验。
895

被折叠的 条评论
为什么被折叠?



