手把手教你如何用jQuery实现图片懒加载，仔细看!

目前，网络上各大论坛，尤其是一些图片类型的网站上，在图片加载时均采用了一种名为懒加载的方式，具体表现为，当页面被请求时，只加载可视区域的图片，其它部分的图片则不加载，只有这些图片出现在可视区域时才会动态加载这些图片，从而节约了网络带宽和提高了初次加载的速度。

页面中的img元素，如果没有src属性，浏览器就不会发出请求去下载图片，只有通过javascript设置了图片路径，浏览器才会发送请求。

懒加载的原理就是先在页面中把所有的图片统一使用一张占位图进行占位，把正真的路径存在元素的自定义属性“data-src”（这个名字起个自己认识好记的就行）里，要用的时候就取出来，把它的值赋值给img的src属性。

1. 只有height()函数可用于window或document对象。

2. "支持写操作"表示该函数可以为元素设置高度值。

3. 1.4.1+ height()新增支持参数为函数(之前只支持数值)。

4. 1.8.0+ innerHeight()支持参数为数值或函数。

如何判断一个元素是否出现在窗口可视范围（浏览器的上边缘和下边缘之间，肉眼可视）。写出一个函数isVisible实现

当窗口滚动时，判断一个元素是不是出现在窗口可视范围。每次出现都在控制台打印 true 。用代码实现

使用jQuery实现懒加载

如果觉得我的文章对您有用，请点赞收藏。您的支持将鼓励我继续收集资料继续创作！