使用BeautifulSoup提取指定class的div数值为空如何解决

问题原因 #

目标页面基于AngularJS实现动态数据渲染，你要提取的24,8是页面加载完成后，JavaScript从后端获取数据后才填充到对应div节点中的。使用requests直接请求只能拿到未执行JS的初始静态HTML，对应div还没有填充内容，因此返回空标签。

可行解决方案 #

方案1：直接请求后端数据接口（推荐）

这是效率最高、最稳定的方案，操作步骤如下：

• 打开浏览器开发者工具（按F12），切换到「网络」标签，刷新目标页面
• 筛选「XHR/抓取」类型的请求，逐个查看响应内容，找到返回温度等气象数据的API接口
• 直接用requests请求该接口，解析返回的JSON格式数据就能直接拿到目标温度值，不需要解析HTML

方案2：使用支持JS渲染的爬虫工具

如果找不到对应接口，可以使用能够模拟浏览器运行、执行页面JS的工具加载完整页面后再提取内容，以Playwright为例，示例代码如下：
首先安装依赖：

pip install playwright
playwright install chromium

爬取代码：

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    # 启动无头浏览器（无界面模式）
    browser = p.chromium.launch(headless=True)
    page = browser.new_page()
    page.goto("https://mgm.gov.tr/tahmin/il-ve-ilceler.aspx?il=ANTALYA&ilce=KUMLUCA")
    # 等待目标元素内容加载完成
    temp_locator = page.locator("div.anlik-sicaklik-deger")
    temp_locator.wait_for()
    # 提取文本并去除首尾空白
    sicaklik = temp_locator.inner_text().strip()
    print(sicaklik)
    browser.close()

你也可以用Selenium等同类工具实现相同逻辑，核心原理都是模拟浏览器运行JS得到完整渲染后的DOM树再提取内容。

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