本文为大家分享了js实现延迟加载思想和首屏延迟加载的具体代码，供大家参考，具体内容如下

作用:保证页面打开的速度（3s之内如果首页打不开就已经算是死亡页面了）

原理:

　　1）、对于首屏内容中的图片:首先给对应的区域一张默认图片占的位置（默认图需要非常的小，一般可以维持在5kb以内），当首屏内容都加载完成后（或者也可以给一个延迟的时间），我在开始加载真实的图片

　　2）、对于其他屏中的图片：也是给一张默认的图片占位，当滚动条滚动到对应区域的时候，我们再开始加载真实的图片

　　扩展：数据的异步加载，开始只把前两屏的数据加载绑定出来，后面的数据不进行处理，当页面滚动到对应区域的时候，在重新请求数据绑定渲染数据

具体可以看一下下图

首屏的延迟加载代码如下:

<Meta charset="UTF-8">

多屏单张图片的延迟加载

具体代码如下:

<Meta charset="UTF-8">

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

原文链接：https://www.f2er.com/js/37792.html

js延迟加载

• 上一篇：js实现多张图片延迟加载效果下一篇：IScroll那些事_当内容不足时下拉刷