容器，实际的数据内容尚未被JavaScript注入，因此read_html会返回一个空列表。
即使使用Selenium等自动化工具模拟浏览器行为，如果只是简单地获取元素的outerHTML属性，也可能因为数据是通过独立的API请求获取并渲染的，导致获取到的HTML字符串仍不包含实际数据，或者只包含一个空的表格结构。解决这类问题的关键在于绕过HTML解析，直接与数据源进行交互。
2. 定位动态数据源：使用浏览器开发者工具
要成功抓取动态加载的表格数据，核心步骤是找到网页背后获取数据的API请求。这通常可以通过浏览器的开发者工具（Developer Tools）来完成。
2.1 打开开发者工具
Chrome: 右键点击页面 -> 检查 (Inspect)，或按 F12。Firefox: 右键点击页面 -> 检查元素 (Inspect Element)，或按 F12。
2.2 监控网络请求
在开发者工具面板中，切换到 “Network”（网络） 标签页。刷新您要抓取数据的网页。在网络请求列表中，通常会看到大量的请求。为了聚焦于数据请求，可以使用过滤器。在过滤器中输入 “XHR” 或 “Fetch/XHR” ，这将只显示XMLHttpRequest和Fetch API发出的异步请求，这些请求通常用于获取动态数据。观察在表格数据出现时，哪些XHR请求被触发。点击这些请求，查看其 “Headers”（请求头） 、“Payload”（请求载荷/表单数据） 和 “Response”（响应） 。Headers: 包含请求的URL、请求方法（GET/POST）、User-Agent等信息。Payload: 如果是POST请求，这里会显示发送到服务器的数据（例如查询参数）。Response: 这是服务器返回的原始数据，通常是JSON格式，也可能是XML或纯文本。这就是我们最终想要获取的数据。
通过分析这些请求，您将能够确定数据请求的URL、请求方法（GET或POST）、需要发送的任何参数以及响应数据的格式。
表格形态的AI工作流搭建工具，支持批量化的AI创作与分析任务，接入DeepSeek R1满血版
3. 使用requests库模拟数据请求
一旦识别出数据源的API请求，我们就可以使用Python的requests库来模拟这个请求，直接获取原始数据。
3.1 准备请求参数
根据开发者工具中观察到的XHR请求信息，提取以下关键参数：
url : 请求的完整URL。method : 请求方法，通常是GET或POST。payload (或 params) : 如果是POST请求，需要提供data参数（表单数据）；如果是GET请求，需要提供params参数（URL查询参数）。headers : 某些网站可能需要特定的请求头，例如User-Agent，以模拟浏览器行为，防止被服务器识别为爬
以本例为例，通过开发者工具分析，我们发现数据是通过一个POST请求发送到https://anex.us/grades/getData/，并带有一些表单数据。
3.2 编写Python代码获取数据
import requestsimport pandas as pd# 1. 定义数据请求的URLurl = 'https://anex.us/grades/getData/'# 2. 定义请求的载荷（payload），对应开发者工具中看到的Form Data# 在本例中，查询ENGR 102的成绩数据payload = {'dept': 'ENGR', 'number': '102'}# 3. 定义请求头，模拟浏览器行为# 包含User-Agent通常能有效避免部分反爬机制headers = {'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64; rv:120.0) Gecko/20100101 Firefox/120.0'}# 4. 发送POST请求并获取响应# 对于GET请求，使用 requests.get(url, params=payload, headers=headers)response = requests.post(url, data=payload, headers=headers)# 5. 检查请求是否成功response.raise_for_status() # 如果请求失败（例如4xx或5xx状态码），会抛出HTTPError# 6. 解析JSON响应数据# 大多数动态数据API返回JSON格式data = response.json()# 7. 将JSON数据转换为Pandas DataFrame# 根据JSON结构，提取包含表格数据的部分。# 在本例中，数据位于 'classes' 键下df = pd.DataFrame(data['classes'])# 打印DataFrame的前几行以验证数据print(df.head())
3.3 代码输出示例
dept number section A B C D F I S U Q X prof year semester gpa0 ENGR 102 20 18 17 8 2 3 0 0 0 1 0 AMINI N 2018 FALL 2.93751 ENGR 102 21 18 31 15 4 1 0 0 0 0 0 KOOLA P 2018 FALL 2.884057971014492 ENGR 102 22 10 28 16 2 3 0 0 0 0 0 SHAW S 2018 FALL 2.677966101694923 ENGR 102 26 9 24 10 4 6 0 0 0 0 0 SUBRAMANIAN R 2018 FALL 2.490566037735854 ENGR 102 201 21 12 1 1 0 0 0 0 0 0 IJAZ M 2018 FALL 3.51428571428571
4. 注意事项与最佳实践
User-Agent头部 : 很多网站会检查User-Agent头部来识别请求来源。如果缺少或使用了默认的requests库的User-Agent，可能会被拒绝访问。因此，模拟一个常见的浏览器User-Agent是良好的实践。请求方法 : 仔细区分GET和POST请求。GET请求的参数通常在URL中，而POST请求的参数在请求体中。数据格式 : 虽然JSON是最常见的API响应格式，但也可能遇到XML、CSV或纯文本。requests库提供了多种解析方法，例如response.text、response.content。错误处理 : 始终加入错误处理机制，例如使用try-except块捕获requests.exceptions.RequestException，以应对网络问题、服务器错误或API响应异常。API限制与使用条款 : 在抓取数据时，务必遵守网站的服务条款和API使用政策。过度频繁的请求可能会导致IP被封禁。对于大型抓取任务，考虑设置请求间隔、使用代理IP等策略。动态参数 : 有些API请求的payload或params可能包含动态生成的令牌（token）或时间戳。如果遇到这种情况，可能需要更复杂的逻辑来模拟，例如先访问页面获取令牌，再进行数据请求。
总结
当pandas.read_html无法满足动态网页表格抓取的需求时，最有效的方法是深入其背后，通过浏览器开发者工具识别并直接调用数据接口（XHR请求）。利用requests库模拟这些请求，获取原始结构化数据（通常是JSON），再结合pandas进行数据清洗和分析，可以高效、准确地提取所需信息。掌握这一技巧，将极大地扩展您从网络获取数据的能力。
以上就是如何高效抓取动态加载的网页表格数据的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。https://www.chuangxiangniao.com/p/565147.html
(0)
打赏
相关推荐
灵活展示图片：如何不拉伸不裁剪 在界面设计中，常常需要以原尺寸展示用户上传的图片。本文将介绍一种在 uniapp 框架中实现该功能的简单方法。 对于不同尺寸的图片，可以采用以下处理方式： 极端宽高比：撑满屏幕宽度或高度，再等比缩放居中。非极端宽高比：居中显示，若能撑满则撑满。 然而，如果需要不拉伸不…
如何在不影响用户界面的情况下实现控制台乱码？ 当在小说网站上下载小说时，大家可能会遇到一个问题：网站上的文本在网页内正常显示，但是在控制台中却是乱码。如何实现此类操作，从而在不影响用户界面（UI）的情况下保持控制台乱码呢？ 答案在于使用自定义字体。网站可以通过在服务器端配置自定义字体，并通过在客户端…
地图上气泡信息框的巧妙生成 地图上气泡信息框是一种常用的交互功能，它简便易用，能够为用户提供额外信息。本文将探讨如何借助地图库的功能轻松创建这一功能。 利用地图库的原生功能 大多数地图库，如高德地图，都提供了现成的信息窗体和右键菜单功能。这些功能可以通过以下途径实现： 高德地图 JS API 参考文…
如何实现元素scrollleft变化时的平滑动画效果？ 在许多网页应用中，滚动容器的水平滚动条（scrollleft）需要频繁使用。为了让滚动动作更加自然，你希望给scrollleft的变化添加动画效果。 解决方案：scroll-behavior 属性 要实现scrollleft变化时的平滑动画效果…
给滚动元素平滑过渡 如何在滚动条属性（scrollleft）发生改变时为元素添加平滑的过渡效果？ 解决方案：scroll-behavior 属性 为滚动容器设置 scroll-behavior 属性可以实现平滑滚动。 html 代码： click the button to slide right!…
灵活选择元素个数不固定的指定类名子元素 在网页布局中，有时需要选择特定类名的子元素，但这些元素的数量并不固定。例如，下面这段 html 代码中，activebar 和 item 元素的数量均不固定： *n *n 如果需要选择第一个 item元素，可以使用 css 选择器 :nth-child()。该…
使用 svg 实现自定义虚线边框 如何实现一个具有自定义宽度、间距和半径的虚线边框是一个常见的前端开发问题。传统的解决方案通常涉及使用 border-image 引入切片图片，但是这种方法存在引入外部资源、性能低下的缺点。 为了避免上述问题，可以使用 svg（可缩放矢量图形）来创建纯代码实现。一种方…
如何跨越localhost使用本地图片？ 问题: 在本地使用mask js库时，引入本地图片会报跨域错误。 解决方案: 要解决此问题，需要使用本地服务器启动文件，以http或https协议访问图片，而不是使用file://协议。例如： python -m http.server 8000 然后，可以…
如何让 元素跟随文本高度，而不是撑高父容器 在页面布局中，经常遇到父容器高度被子元素撑开的问题。在图例所示的案例中，父容器被较高的图片撑开，而文本的高度没有被考虑。本问答将提供纯css解决方案，让图片跟随文本高度，确保父容器的高度不会被图片影响。 解决方法 为了解决这个问题，需要将图片从文档流中脱离…
解决 css mask 属性未请求图片的问题 在使用 css mask 属性时，指定了图片地址，但网络面板显示未请求获取该图片，这可能是由于浏览器兼容性问题造成的。 问题 如下代码所示： 立即学习“前端免费学习笔记（深入）”； icon [data-icon=”cloud”] { –icon-cl…
如何利用 css 选中激活标签并影响相邻元素？ 为了实现激活标签影响相邻元素的样式需求，可以通过 :has 选择器来实现。以下是如何具体操作： 对于激活标签相邻后的元素，可以在 css 中使用以下代码进行设置： li:has(+li.active) { border-radius: 0 0 10px…
win10设置界面的鼠标移动显示周边的样式（探照灯效果）的实现方式 在windows设置界面的鼠标悬浮效果中，光标周围会显示一个放大区域。在前端开发中，可以通过多种方式实现类似的效果。 使用css 使用css的transform和box-shadow属性。通过将transform: scale(1.…
为什么在 Safari 中自定义样式表未能正常工作？ 在 Safari 的偏好设置中设置自定义样式表后，您对其进行测试却发现效果不同。在您自己的网页中，样式有效，而在百度页面中却失效。 造成这种情况的原因是，第一个访问的项目使用了文件协议，可以访问本地目录中的图片文件。而第二个访问的百度使用了 ht…
如何在前端实现 Windows 10 设置界面中的鼠标移动探照灯效果 想要在前端开发中实现 Windows 10 设置界面中类似的鼠标移动探照灯效果，可以通过以下途径： CSS 解决方案 DEMO 1: Windows 10 网格悬停效果：https://codepen.io/tr4553r7/pe…
css mask属性未能加载图片的解决方法 使用css mask属性指定图片url时，如示例中所示： mask: url(“https://api.iconify.design/mdi:apple-icloud.svg”) center / contain no-repeat; 但是，在网络面板中却…
为元素添加时尚的斑马线边框 在网页设计中，有时我们需要添加时尚的边框来提升元素的视觉效果。其中，斑马线边框是一种既醒目又别致的设计元素。 实现斜向斑马线边框 要实现斜向斑马线间隔圆环，我们可以使用css paint api。该api提供了强大的功能，可以让我们在元素上绘制复杂的图形。 立即学习“前端…
如何让图片不撑高父容器？ 当父容器包含不同高度的子元素时，父容器的高度通常会被最高元素撑开。如果你希望父容器的高度由文本内容撑开，避免图片对其产生影响，可以通过以下 css 解决方法： 绝对定位元素： .child-image { position: absolute; top: 0; left: …
跨域疑难：如何解决 mask 引入本地图片产生的跨域问题？ 在使用 mask 导入本地图片时，你可能会遇到令人沮丧的跨域错误。为什么会出现跨域问题呢？让我们深入了解一下： mask 框架假设你以 http(s) 协议加载你的 html 文件，而当使用 file:// 协议打开本地文件时，就会产生跨域…
我正在尝试将文本附加到棕色框的左侧。我不能。我不知道代码有什么问题。请帮助我。 css .hero { position: relative; bottom: 80px; display: flex; justify-content: left; align-items: start; color:…
前端代码辅助工具：可靠性探讨 对于前端工程师来说，在HTML、CSS和JavaScript开发中借助AI工具是司空见惯的事情。然而，并非所有工具都能提供同等的可靠性。 个性化需求 关于哪个AI工具最可靠，这个问题没有一刀切的答案。每个人的使用习惯和项目需求各不相同。以下是一些影响选择的重要因素： 立…
微信扫一扫 
支付宝扫一扫 
