懒加载

Posted 2021-12-13 manban

1.什么是懒加载：

　　       懒加载也就是延时加载，当访问一个页面的时候，我们先把img元素或者其他元素图片路径替换成一张大小为1*！图片的路径（这样就只需要请求一次，俗称占位符），只有当图片出现浏览器的可视区域内时，才设置真的路径，让图片显示出来，这就是懒加载。

2.使用懒加载的好处：

　　　　1.页面加载速度快，

　　　　2.可减轻服务器的压力

　　　　3.节省流量

　　　　4.用户体验好

3.为什么要使用懒加载

　　　　因为很多页面，内容很丰富，图片较多，比如说各种商场也面，页面图片数量比较多，少说百来K，多则上兆，有时候没有完全一次性的加载完毕。像京东，淘宝等网站4.、懒4.加载实现的步骤

　　　　1、将图片地址放在元素的自定义属性中

 

　　　　2、当页面加载完成后，根据scrollTop判断图片是否在用户的视野内，如果在就取出属性值放到src属性中