soup.select()中CSS选择器返回空值的技术求助

这是很常见的动态内容加载问题，我来帮你分析解决：

问题根源 #

目标网站的内容是通过JavaScript动态渲染的。你用requests.get()只能获取到服务器返回的初始静态HTML，而浏览器里看到的.si-section-header > span.si-title元素，是浏览器加载页面后执行JS脚本才生成的——静态HTML里根本没有这些元素，自然select()会返回空列表。

解决方案 #

方案1：直接调用网站的API接口（推荐） #

很多动态网站会通过API接口获取数据再渲染到页面上，我们可以直接抓取这个API，比模拟浏览器更高效。

步骤：

1. 打开浏览器开发者工具（F12），切换到「Network」标签，刷新页面。
2. 筛选「XHR」类型的请求，找到返回队伍相关数据的API接口。
3. 直接请求该API获取JSON格式的数据，提取需要的内容。

示例代码：

import requests

# 从浏览器Network中抓取到的API接口
API_URL = "https://www.prokabaddi.com/api/teams/1"
# 加上请求头模拟浏览器，避免被拦截
headers = {
    "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36"
}

response = requests.get(API_URL, headers=headers)
data = response.json()

# 提取类似你要的"si-title"对应的内容，比如队伍的各类信息
team_name = data["team"]["name"]
print(f"队伍名称: {team_name}")
# 其他需要的字段可以根据返回的JSON结构自行提取

方案2：用Selenium模拟浏览器渲染页面 #

如果找不到合适的API，可以用Selenium模拟真实浏览器加载页面，这样能获取到JS渲染后的完整页面源码。

首先需要安装依赖：

pip install selenium webdriver-manager

示例代码：

from selenium import webdriver
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
import bs4

URL = "https://www.prokabaddi.com/teams/bengaluru-bulls-profile-1"

# 初始化Chrome浏览器（webdriver-manager会自动下载对应驱动）
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))
driver.get(URL)

# 获取渲染完成后的页面源码
page_source = driver.page_source
# 关闭浏览器
driver.quit()

# 用BeautifulSoup解析页面
soup = bs4.BeautifulSoup(page_source, 'html.parser')
target_elements = soup.select('.si-section-header > span.si-title')

# 输出结果
print(target_elements)
for elem in target_elements:
    print(elem.get_text(strip=True))

小提示 #

• 优先选择API方案，速度更快、资源消耗更少，而且数据格式更规整，方便提取。
• 使用Selenium时，注意添加适当的等待时间（比如time.sleep()或显式等待），确保页面完全渲染完成再获取源码。

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