为网页图片加上loading="lazy"延迟加载资源(懒加载)
- A
HTML元素<img>延迟加载属性 —— loading属性值lazy允许浏览器选择性加载IMG元素,根据用户滚动操作至其元素附近执行加载,一定程度起到节流的作用。
那么问题来了,哪些场景业务需要用到图片懒加载技术呢?
答:当前页面图片元素过多,避免不必要的流量浪费;如果不是需要加载很多图片的话那还是不要用了,影响用户体验~
使用方法
<img src="load.jpg" loading="lazy" alt="阅客网" />你没看错,和普通的img标签相比,只多出了loading="lazy"这个属性,就是这么简单;它就是今天所要了解的主角。
可选值
loading="lazy" loading="eager"lazy 懒加载,即:延迟获取资源。
eager 立即加载,即:缺省值,你不加这个loading属性,它默认就是这个。
傲世》原创,转载请保留文章出处。
本文链接:https://www.recho.cn/223.html
如您对本文章内容有所疑问、反馈或补充,欢迎通过邮箱:[email protected] 联系我们!
版权声明:若无特殊注明,本文为《正文到此结束