使用BeautifulSoup爬取电商商品图片失效：匹配div为空、找不到目标picture标签

• 你遇到的爬取结果为空的情况，和class类标签本身没有关系：你看到的src__Wrapper-xr9q25-1 fwzdjF只是前端工程CSS-in-JS方案生成的带哈希后缀的动态样式类名，本身不会阻碍内容获取。
• 爬取失败的核心逻辑是：目标电商站点的商品图片DOM是客户端JavaScript动态渲染生成的。requests库默认发送纯静态HTTP请求，拿到的是服务端返回的初始HTML模板，本身就不包含JS执行后才插入的图片相关节点，所以你获取到的wrapper容器本身就是空的，自然无法找到内部嵌套的picture标签。

优先方案：直接定位接口数据源 #

跳过前端DOM渲染环节，是效率最高、稳定性最强的方式：

• 打开目标页面的开发者工具网络面板，筛选XHR/Fetch类请求，定位到返回商品图片地址的JSON接口
• 复用接口对应的请求头、请求参数，直接用requests请求接口获取结构化的图片链接，不需要等待前端JS执行

备选方案：执行页面JS渲染后再解析DOM #

如果逆向接口成本较高，可以使用支持JS渲染的工具完成页面加载：

• 替换原代码中的静态请求逻辑，使用playwright、selenium这类无头浏览器工具访问目标页面，等待图片相关DOM元素加载完成
• 拿到渲染后的完整页面源码，再交由BeautifulSoup解析，即可正常获取到目标标签内容

参考实现代码：

from playwright.sync_api import sync_playwright
from bs4 import BeautifulSoup
import re

with sync_playwright() as p:
    browser = p.chromium.launch(headless=True)
    page = browser.new_page(user_agent="Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36")
    # 访问目标商品页
    page.goto("你的目标商品链接")
    # 等待目标picture标签加载完成
    page.wait_for_selector('picture[class*="src__Picture"]')
    rendered_html = page.content()
    browser.close()

bs = BeautifulSoup(rendered_html, "lxml")
# 用正则模糊匹配类名，避免动态哈希值变动导致匹配失效
target_pic = bs.find('picture', class_=re.compile(r'src__Picture-'))

类名匹配的兼容性优化 #

这类CSS-in-JS生成的类名后半段（哈希部分，如xr9q25-2、gKwsnn）会随站点构建版本更新变化，写死完整类名很容易导致匹配失效：

• 定位元素时可使用类名的固定前缀做模糊匹配，无需写全类名，哪怕后续哈希值变动也能正常匹配到元素
• 定位锚点优先选择元素的语义化属性、DOM树相对层级，不要完全依赖固定类名做匹配

注意：仅靠requests获取静态HTML的方式，永远拿不到这类动态渲染站点的JS生成内容，和类名是否特殊没有关系。

内容的提问来源于stack exchange，提问作者dsenese