
html纯js实现图片懒加载案例代码下载地址:http://www.jiajiajia.club/file/info/JA67P0/123
<script>
window.onload = function(){
//imgs是目标区域的所有img标签集合
var imgs=document.getElementsByTagName("img");
var imgDatas=new Array();
for(var i=0;i<imgs.length;i++){
if(imgs[i].getAttribute("data-src")!=null){
imgDatas[i]=imgs[i];
}
}
function lazyload(){
var h = window.innerHeight;
var s = document.documentElement.scrollTop || document.body.scrollTop;
for(var i=0;i<imgDatas.length;i++){
if ((h+s)>imgDatas[i].offsetTop) {
imgDatas[i].src = imgDatas[i].getAttribute('data-src')
imgDatas.splice(i,1);
}
}
}
lazyload();
window.onscroll =function(){
lazyload();
}
}
</script>