手写懒加载

<img src="loading.gif" data-src="image1.png">
<img src="loading.gif" data-src="image2.png">
<img src="loading.gif" data-src="image3.png">
<img src="loading.gif" data-src="image4.png">
<img src="loading.gif" data-src="image5.png">


const imgs = document.querySelectorAll('img');

function lazyload({
	// 浏览器滚动的过的距离
	const scrollTop = document.body.scrollTop;
	// 是浏览器可视区的高度
	const winHeight = window.innerHeight;

	for(let i=0;i<imgs.length;i++){
	    // 元素顶部距离文档顶部的高度
		if(imgs[i].offsetTop < scrollTop+winHeight){
			// 用真正的图片地址替换src
			imgs[i].src=imgs[i].getAttribute('data-src');
		}
	}
}