如何统一提取HTML中img标签的图片链接（兼容src与data-src属性）

霞舞 2025-12-31 00:00:00 次阅读

本文介绍在python网络爬虫中，如何使用beautifulsoup灵活提取img标签的图片url，无论其使用src还是data-src属性，确保所有图片链接被一致、准确地获取为纯文本。

在网页开发中，为优化加载性能，许多网站采用“懒加载”（lazy loading）技术：首屏图片直接通过 src 属性加载，而后续图片则使用 data-src 属性暂存URL，待滚动至可视区域时再由JavaScript动态赋值给 src。这导致在Web Scraping过程中，同一页面的标签可能混用 src 和 data-src，无法用单一属性名统一提取。

直接硬编码 tag.get('src') 或 tag.get('data-src') 都会遗漏部分链接。正确做法是对每个匹配的元素进行属性存在性判断，优先取 src（因其代表当前有效链接），若不存在则回退至 data-src（通常为备用真实URL）。

以下为完整、可运行的解决方案：

from bs4 import BeautifulSoup

html = '''
@@##@@
@@##@@
@@##@@
'''

soup = BeautifulSoup(html, 'html.parser')
image_urls = []

for img in soup.select('img.class_name'):  # 使用CSS选择器精准定位目标img
    url = img.get('src') or img.get('data-src')  # 短路逻辑：有src则用src，否则用data-src
    if url:  # 过滤空值，避免None或空字符串
        image_urls.append(url)

# 输出结果
for url in image_urls:
    print(url)

✅ 输出：

https://website1.png
https://website2.png
https://website3.png

? 关键技巧说明：

使用 soup.select('img.class_name') 比 find_all('img', class_='class_name') 更简洁且支持复合类名（如 class_name late）；
img.get('src') or img.get('data-src') 利用Python的短路求值，语义清晰、代码精简；
建议始终检查 url 是否为真值（if url:），因某些可能既无 src 也无 data-src（如占位符或JS生成元素）；
若需去重，可将 image_urls 改为 set()，最后转为列表排序或保持插入顺序（Python 3.7+ dict/set 有序）。

该方法健壮、通用，适用于绝大多数懒加载场景，是生产级爬虫中处理混合属性图片链接的标准实践。