页面 HTML 源与我从“检查”中看到的源不同答案

【问题标题】：Page HTML source different from the source I see from "Inspect"页面 HTML 源与我从“检查”中看到的源不同
【发布时间】：2019-01-23 21:34:43
【问题描述】：

我正在尝试使用 Python 在https://aws.amazon.com/ec2/spot/instance-advisor/ 中的表中通过按需和中断频率来节省信息。

通过在我的网络浏览器（我使用的是 Chrome）上单击“检查”并查看源代码，我发现表中的所有数据都存储在

和标记之间。

但是，在我的代码中，当我这样做时

import requests
from bs4 import BeautifulSoup

source = requests.get('https://aws.amazon.com/ec2/spot/instance-advisor/')
soup = BeautifulSoup(source.text, 'lxml')
print(soup.prettify())

我看到

和之间什么都没有。

造成这种差异的原因是什么？如何在 Python 中下载网页的全部内容？

任何帮助将不胜感激！ :)

【问题讨论】：

您不是在查看源代码，而是在查看 DOM。如果要查看源，请右键单击并选择查看页面源（而不是检查）。 DOM 由 Beautiful Soup 不运行的 JavaScript 构建。

标签： python html python-3.x web-scraping

【解决方案1】：

他们在 DOM 的空 tbody 部分加载后通过 Ajax 加载该数据。

您在检查器中看到的是 RAM 中呈现的页面，因为它存在于那一刻。

数据本身是从这里加载的： https://spot-bid-advisor.s3.amazonaws.com/spot-advisor-data.json

也许这是一个更安全的来源，因为 JSON 数据很容易解析，而 HTML 抓取很容易被破坏。

【讨论】：

感谢您的帮助！您是如何找到数据来源的？
在 Chrome 中，打开开发者侧边栏后，从元素选项卡切换到网络。然后我过滤了 XHR（Ajax 类型请求）并开始读取文件名。我不知道如何在 cmets 中获取内联图像（也许图像降价仅适用于帖子和答案？）但这是我正在谈论的检查员部分的屏幕截图的链接：pbs.twimg.com/media/DxoU6F_WoAAKkib.jpg:large

【解决方案2】：

页面的来源和有效呈现的元素之间存在差异。 Chrome 的“检查”窗口的默认视图向您显示页面的结构当时，在 javascripts 完成任何 dom 操作之后。

如果您单击“源”选项卡，您将看到源与 python 正在下载的相匹配。

您要查找的数据来自其他地方（正如用户 webdevtool 建议的那样）。从那里提取 json 数据 (https://spot-bid-advisor.s3.amazonaws.com/spot-advisor-data.json) 可能会更可靠且更易于处理。

【讨论】：

【解决方案3】：

这可能是因为 BeautifulSoup 没有执行一些客户端 javascript 渲染，所以表仍然是空的。

但我在 Chrome 开发者工具中查找了网络选项卡，发现了您试图抓取的数据。你可以直接从这里下载json文件

https://spot-bid-advisor.s3.amazonaws.com/spot-advisor-data.json

【讨论】：