如何使用requests和bs4获取由外部JS事件加载的页面数据？

嘿，我来帮你理清这个问题的关键点，一步步解决你的困惑～

先解答你的疑问：JavaScript事件监听器不一定紧邻目标元素 #

事件监听器的绑定方式非常灵活：

• 它可以直接写在元素的onclick等属性里（这时候会紧邻元素）；
• 更常见的是在外部脚本中通过选择器（id/class等）找到目标元素后绑定，或者用事件委托（给父元素绑定监听器，处理子元素的事件）。
  你例子里的<span id='data'>就是典型的「初始为空，JS脚本加载后填充内容」的情况，所以用requests获取的静态HTML里看不到文本。

如何用requests+bs4获取目标数据？ #

因为bs4无法执行JavaScript，我们需要绕开前端渲染，直接获取数据来源，分两种常见情况处理：

情况1：数据直接包含在外部脚本中 #

如果那个外部JS脚本里本身就存储着目标数据（比如定义了某个变量存着523532），我们可以直接爬取脚本内容，用正则提取数据：

import requests
import re

# 目标脚本的URL
script_url = "https://static.fcdn.co.il/dyn/projects/profileimageheader/profileimageheader.js?v1.7=4120.516"
# 请求脚本内容
response = requests.get(script_url)
script_content = response.text

# 先查看脚本内容，找到数据的存储格式，比如假设数据在window.profileData这样的变量里
# 这里用正则匹配数字，你需要根据实际脚本内容调整正则规则
match = re.search(r'window\.profileData\s*=\s*"(\d+)"', script_content)
if match:
    target_data = match.group(1)
    print(f"提取到的数据：{target_data}")
else:
    print("未找到目标数据，请检查正则规则或脚本内容")

情况2：脚本通过请求API接口获取数据 #

如果数据是脚本发起额外请求（XHR/fetch）从后端API拿的，那我们需要找到这个API接口直接请求：

1. 打开浏览器开发者工具（按F12），切换到「Network」面板；
2. 刷新页面，找到脚本发起的XHR/fetch请求，查看请求URL、请求头和返回的JSON数据；
3. 用requests模拟这个请求：

import requests

# 从Network面板复制的API接口URL
api_url = "https://目标网站的API地址"
# 模拟浏览器的请求头，避免被反爬（关键是User-Agent，可能还需要Referer、Cookie等）
headers = {
    "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36",
    "Referer": "目标网站的主页URL"
}

# 发起请求获取数据
response = requests.get(api_url, headers=headers)
# 如果返回是JSON格式
data_json = response.json()
# 提取你需要的字段，比如data_json['data']['id']
target_data = data_json.get('data', {}).get('id')
print(f"提取到的数据：{target_data}")

补充说明 #

requests获取的是服务器返回的初始静态HTML，而浏览器会执行JS脚本并动态修改DOM内容，这就是为什么你用bs4看不到span里的文本——因为那部分内容是浏览器渲染后才生成的，初始HTML里本来就没有。

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