使用Selenium抓取网页中关联的H2标题及其段落内容

新闻中心 NEWS CENTER

您当前位置：首页 > 新闻中心 > 网络学院

使用Selenium抓取网页中关联的H2标题及其段落内容

2025-11-01

浏览次数：次

返回列表

使用Selenium抓取网页中关联的H2标题及其段落内容

本教程详细介绍了如何利用selenium和xpath定位策略，高效地从html文档中抓取具有层级关系的h2标题及其后续所有p标签内容。通过构建一个字典结构，将h2标题作为键，其关联的p标签文本聚合为值，最终实现将非结构化网页内容转化为结构化的标题与内容对，并提供了完整的python代码示例。

在网页数据抓取任务中，我们经常需要提取具有特定层级或关联关系的内容，例如文章的标题（通常是H标签）及其对应的正文段落（P标签）。本教程将指导您如何使用Selenium WebDriver，结合XPath定位策略，精确地抓取网页中H2标题及其紧随其后的所有P标签内容，并将其组织成结构化的数据格式。

1. 理解目标数据结构

假设我们有以下HTML结构，其中每个

标签代表一个文章标题，其后紧跟着若干个

标签，这些

标签共同构成了该标题下的文章内容：

<h2><span>Title1</span></h2>
<p>text I want</p>
                    <div class="aritcle_card">
                        <a class="aritcle_card_img" href="/ai/1070">
                            <img src="https://img.php.cn/upload/ai_manual/000/000/000/175680049013074.png" alt="Mureka">
                        </a>
                        <div class="aritcle_card_info">
                            <a href="/ai/1070">Mureka</a>
                            <p>Mureka是昆仑万维最新推出的一款AI音乐创作工具，输入歌词即可生成完整专属歌曲。</p>
                            <div class="">
                                <img src="/static/images/card_xiazai.png" alt="Mureka">
                                <span>1091</span>
                            </div>
                        </div>
                        <a href="/ai/1070" class="aritcle_card_btn">
                            <span>查看详情</span>
                            <img src="/static/images/cardxiayige-3.png" alt="Mureka">
                        </a>
                    </div>
                
<p>text I want</p>
<h2><span>Title2</span></h2>
<p>text I want</p>
<p>text I want</p>
<p>text I want</p>
<h2><span>Title3</span></h2>
<p>text I want</p>
<p>text I want</p>

我们的目标是将这些数据转换为以下结构：

[{'title': 'Title1', 'content': 'text I want text I want'},
 {'title': 'Title2', 'content': 'text I want text I want text I want'},
 {'title': 'Title3', 'content': 'text I want text I want'}]

其中，每个H2标签的文本作为title，其后所有P标签的文本拼接起来作为content。

2. 核心抓取策略

实现这一目标的关键在于：

识别所有H2标题： 作为内容的逻辑分隔符和键。
识别所有P标签： 作为要抓取的内容片段。
建立P标签与H2标题的关联： 对于每个P标签，我们需要确定它属于哪个H2标题。这里将利用XPath的preceding-sibling::h2[1]轴来查找每个P标签最近的前一个H2同级元素。
聚合内容： 将属于同一个H2标题下的所有P标签文本拼接起来。

3. Selenium环境准备

首先，确保您已安装Selenium库和WebDriver管理器。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager

# 初始化Chrome WebDriver
# 使用webdriver_manager自动管理浏览器驱动
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))

# 模拟加载HTML内容
# 在实际应用中，您会使用 driver.get("http://your-website.com")
html_content = '''
<h2><span>Title1</span></h2>
<p>text I want</p>
<p>text I want</p>
<h2><span>Title2</span></h2>
<p>text I want</p>
<p>text I want</p>
<p>text I want</p>
<h2><span>Title3</span></h2>
<p>text I want</p>
<p>text I want</p>
'''
driver.get("data:text/html;charset=utf-8," + html_content)

4. 逐步实现数据抓取

4.1 初始化数据结构

我们首先遍历所有的

标签，以它们的文本作为字典的键，并初始化一个空字符串作为值。这将为每个标题创建一个占位符，用于后续聚合其内容。

# 查找所有H2标签，并初始化一个字典
# 字典的键是H2的文本，值初始化为空字符串
data = dict((e.text, '') for e in driver.find_elements(By.CSS_SELECTOR, 'h2'))
# 此时data可能为: {'Title1': '', 'Title2': '', 'Title3': ''}

4.2 关联P标签并聚合内容

接下来，我们遍历所有的

标签。对于每个

标签，我们使用XPath preceding-sibling::h2[1]来定位其最近的前一个同级

元素。然后，将当前

标签的文本添加到该

标题对应的字典值中。

# 遍历所有P标签，将其内容关联到对应的H2标题
for p in driver.find_elements(By.CSS_SELECTOR, 'p'):
    # 使用XPath查找当前P标签最近的前一个H2同级元素
    # [1]确保只选择最近的一个
    h2_text = p.find_element(By.XPATH, './preceding-sibling::h2[1]').text
    # 将P标签的文本添加到对应H2标题的值中，用空格分隔
    data[h2_text] = data[h2_text] + ' ' + p.text

# 打印聚合后的数据
print("聚合后的原始字典:", data)
# 预期输出: {'Title1': ' text I want text I want', 'Title2': ' text I want text I want text I want', 'Title3': ' text I want text I want'}

XPath解释：

./：表示从当前元素（即当前的
标签）开始。
preceding-sibling::：这是一个轴（axis），它选择当前元素之前的所有同级元素。
h2：指定我们只对
类型的同级元素感兴趣。
[1]：这是一个谓词（predicate），它选择集合中的第一个元素。在这里，它确保我们只获取距离当前
标签最近的那个

标签。

4.3 整理最终输出格式

虽然上述字典已经包含了所有数据，但通常我们更希望将数据整理成列表形式，例如标题列表、内容列表，或者更推荐的——一个包含字典的列表，每个字典代表一个完整的文章条目。

方式一：提取标题和内容列表

# 提取标题列表
titles = list(data.keys())
print("\n标题列表:", titles)
# 预期输出: ['Title1', 'Title2', 'Title3']

# 提取内容列表
contents = list(data.values())
print("内容列表:", contents)
# 预期输出: [' text I want text I want', ' text I want text I want text I want', ' text I want text I want']

方式二：生成结构化的字典列表（推荐）

为了保持数据的结构化和可读性，强烈建议将结果组织成一个包含字典的列表，每个字典包含title和content键。

# 生成一个包含字典的列表，每个字典代表一个文章条目
structured_data = [{'title': x, 'content': y} for x, y in data.items()]
print("\n结构化数据（字典列表）:", structured_data)
# 预期输出:
# [{'title': 'Title1', 'content': ' text I want text I want'},
#  {'title': 'Title2', 'content': ' text I want text I want text I want'},
#  {'title': 'Title3', 'content': ' text I want text I want'}]

5. 完整代码示例

将上述所有步骤整合，形成一个完整的、可运行的Python脚本：

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager

# 1. 初始化WebDriver
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))

# 2. 模拟加载HTML内容
html_content = '''
<h2><span>Title1</span></h2>
<p>text I want</p>
<p>text I want</p>
<h2><span>Title2</span></h2>
<p>text I want</p>
<p>text I want</p>
<p>text I want</p>
<h2><span>Title3</span></h2>
<p>text I want</p>
<p>text I want</p>
'''
driver.get("data:text/html;charset=utf-8," + html_content)

# 3. 初始化数据字典：以H2文本为键，空字符串为值
data = dict((e.text, '') for e in driver.find_elements(By.CSS_SELECTOR, 'h2'))

# 4. 遍历所有P标签，并将其内容聚合到对应的H2标题下
for p in driver.find_elements(By.CSS_SELECTOR, 'p'):
    # 使用XPath定位当前P标签最近的前一个H2同级元素
    h2_text = p.find_element(By.XPATH, './preceding-sibling::h2[1]').text
    # 拼接P标签的文本到对应H2的值中
    data[h2_text] = data[h2_text] + ' ' + p.text

# 5. 将聚合后的数据转换为结构化的字典列表
structured_output = [{'title': x, 'content': y} for x, y in data.items()]

# 6. 打印最终结果
print(structured_output)

# 7. 关闭WebDriver
driver.quit()

6. 注意事项与总结

XPath的精确性： preceding-sibling::h2[1]是此方法的核心，它确保了每个P标签都被正确地关联到其最近的H2标题。如果HTML结构更复杂，例如H2和P之间可能存在其他不相关的标签，此XPath仍然有效，因为它只关心同级元素。
内容拼接： 在拼接P标签文本时，使用' ' + p.text可以确保不同段落之间有空格分隔，提高可读性。
健壮性： 这种方法对于HTML结构相对一致的页面非常有效。如果H2和P标签的层级关系或顺序不固定，可能需要调整XPath或其他定位策略。
数据清洗： 抓取到的文本可能包含多余的空格、换行符等，在实际应用中，通常需要进行额外的数据清洗步骤（例如使用.strip()或正则表达式）来获取更干净的数据。
推荐输出格式： 将数据组织成包含字典的列表（如[{'title': '...', 'content': '...'}]）是处理结构化数据的最佳实践，因为它清晰、易于访问和进一步处理（如保存到JSON、CSV或数据库）。

通过本教程，您应该能够熟练地使用Selenium和XPath来抓取网页中具有层级关联的标题和内容，并将它们转化为易于分析和使用的结构化数据。

以上就是使用Selenium抓取网页中关联的H2标题及其段落内容的详细内容，更多请关注其它相关文章！

# 单选框 # 自学英语网站建设 # 察隅林芝网站建设流程 # 医院网站建设排名第一 # 长春抖音推广官方网站 # 上海新站seo技术 # 肇庆seo网络推广专业 # 亳州新型营销推广策划 # 奉化网络推广招聘网站 # 兴宁全网推广营销 # 购物网站建设技术难点 # 转换为 # 转化为 # 这是一个 # 将其 # css # 表单 # 数据结构 # 遍历 # 结构化 # python脚 # webdriver # 数据清洗 # csv # 浏览器 # 正则表达式 # json # js # html # python

相关栏目：【科技资讯46185 】【网络学院92790 】

上一篇：解决J*aScript中innerHTML内容闪烁消失的问题

下一篇：如何为一个包含图片的 div 元素设置背景图片

首页

关于我们

产品展示

咨询研究

新闻中心

留言板

联系我们

新闻中心 NEWS CENTER

使用Selenium抓取网页中关联的H2标题及其段落内容

1. 理解目标数据结构

标签代表一个文章标题，其后紧跟着若干个

2. 核心抓取策略

3. Selenium环境准备

4. 逐步实现数据抓取

4.1 初始化数据结构

4.2 关联P标签并聚合内容

元素。然后，将当前

类型的同级元素感兴趣。

标签。

4.3 整理最终输出格式

5. 完整代码示例

6. 注意事项与总结