【Python爬虫】懒加载

懒加载是一种优化网页性能的技术,它推迟非首屏内容的加载,尤其是大图片。通过设置占位图和利用JavaScript监听滚动事件,在图片进入视口时再加载。这种方式能加快页面初始加载速度,减少服务器压力,优化用户体验。对于网络爬虫,需关注data-original或src2等属性来获取真正图片源。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

懒加载,也就是延迟加载。

一、懒加载的具体表现

  当访问一个页面的时候,先把img元素或是其他元素的背景图片路径替换成一张占位图的路径,这样就只需请求一次,只有当图片出现在浏览器的可视区域内时,才设置图片正真的路径,让图片显示出来。

举例1:某网站还没浏览到的图片img元素中的src为:…/static/common/com_images/img-loding.png
而浏览到的图片img元素中的src为://scpic3.chinaz.net/files/default/imgs/2023-05-15/f84850852fd8a265_s.jpg
(其实真正的图片链接在img元素中的data-original属性中,当浏览到的图片img元素中的data-original的值会赋给src)

举例2:某网站还没浏览到的图片img元素中的src2为://scpic3.chinaz.net/files/default/imgs/2023-05-15/f84850852fd8a265_s.jpg
而浏览到的图片img元素中的src2变为src。

二、懒加载的好处

  很多页面,内容很丰富,页面很长,图片较多。比如瀑布流,图片数量多且大,如果一次性加载完毕,用户等待时间过长。 懒加载页面加载速度快、可以减轻服务器的压力、节约了流量,用户体验好。

三、懒加载的技术原理

  页面中的img元素,如果没有src属性,浏览器就不会发出请求去下载图片,只有通过javascript设置了图片路径,浏览器才会发送请求。 懒加载的就是先在页面中把所有的图片统一使用一张占位图进行占位,把真正的路径存在元素的“pic-url”(自定义命名)属性里,要用的时候就取出来。

四、懒加载的实现步骤

1、不要将图片地址放到src属性中,而是放到其它属性中。

2、页面加载完成后,根据scrollTop判断图片是否在用户的视野内,如果在,则将data-original属性中的值取出存放到src属性中。

3、在滚动事件中重复判断图片是否进入视野,如果进入,则将data-original属性中的值取出存放到src属性中。

五、爬虫遇懒加载处理方法

Python网络爬虫中,解析服务器响应的文件的操作(遇到网页图片懒加载的解决方法):

#解析服务器响应的文件
tree = etree.HTML(content)
# 查找指定元素的alt属性值
name_list = tree.xpath('//div[@class="container"]//img/@alt')
# 查找指定元素的src(不存在懒加载情况解析方式)
src_list = tree.xpath('//div[@class="container"]//img/@src')
# 以上懒加载举例1的解决方式:
src_list = tree.xpath('//div[@class="container"]//img/@data-original')
# 以上懒加载举例2的解决方式:
src_list = tree.xpath('//div[@class="container"]//img/@src')
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值