图片懒加载问题

Question

老师，昨天面试的时候，面试官问了图片懒加载是一次性循环出来所有的图片吗，怎么判断是在可视区域内的图片，我知道图片懒加载的原理，但是他问的这个我不知道该怎么回答

Answer 1

双越 2021-03-13 17:38:48

第一，当然不是一次性循环出所有图片，需要采用分页的方式，每次加载一页

第二，通过 getBoundingClientRect 可以获取图片 elem 的距离浏览器底部的距离，这样判断图片是否在可视区域内 https://developer.mozilla.org/zh-CN/docs/Web/API/Element/getBoundingClientRect