BeautifulSoup爬取表格无法识别全部<tr>且日期提取异常如何解决

问题原因 #

• 无法识别全部<tr>元素：目标页面的表格数据未直接内嵌在静态HTML源码中，是页面加载完成后由JavaScript异步请求后端接口数据，再动态渲染到DOM结构里的。直接使用requests/urllib拉取的是未执行JS的原始静态代码，仅包含表格框架结构，无实际数据对应的<tr>节点，因此只能抓取到极少量<tr>。
• 日期字段输出为on {{data}}：抓取到的内容是前端框架的模板占位符，原始HTML中日期位置默认写入的是{{data}}这类插值标记，需要等JS执行完成后才会被替换为真实日期值，静态爬取只能拿到未替换的占位符内容。

解决方案 #

方案1：直接请求后端数据接口（推荐，执行效率最高） #

页面数据以JSON格式存储在公开可访问的后端接口中，无需复杂鉴权参数，直接请求接口拿到JSON数据后可直接转换为结构化表格，无需解析HTML。
参考代码：

import requests
import pandas as pd

headers = {'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36' }
# 请求后端数据接口
resp = requests.get("https://cms.mediahack.co.za/api/v1/articles/bhekisisa-vaccination-table?version=1721290137933", headers=headers).json()

# 提取表格数据
table_data = resp['data']['content_components'][0]['items']
# 提取更新日期
update_date = resp['data']['updated_at']
# 转换为DataFrame
df = pd.DataFrame(table_data)
print(df.head())
print("数据更新日期：", update_date)

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

如果需要解析渲染后的完整HTML结构，可以使用Selenium、Playwright等无头浏览器工具，等待页面JS执行完成后再提取DOM元素，即可拿到完整的<tr>节点和真实日期值。
参考代码（以Selenium为例）：

from selenium import webdriver
from selenium.webdriver.chrome.options import Options
from bs4 import BeautifulSoup
import pandas as pd

chrome_options = Options()
# 启用无头模式，不弹出浏览器窗口
chrome_options.add_argument("--headless=new")
chrome_options.add_argument("user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36")

driver = webdriver.Chrome(options=chrome_options)
driver.get("https://hosted.mediahack.co.za/bhekisisa-vaccination-table/")
# 等待页面渲染完成，可替换为显式等待提升稳定性
driver.implicitly_wait(5)

# 获取渲染完成的完整HTML
page_html = driver.page_source
driver.quit()

page_soup = BeautifulSoup(page_html, "html.parser")
# 正常提取表格、日期等内容
table = page_soup.find("table")
tr_list = table.find_all("tr")
print("tr元素总数：", len(tr_list))
date = page_soup.find("div", {"class":"header-subhead"}).text
print("日期内容：", date)

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