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

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

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

1. 理解目标数据结构

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

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

标签，这些

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

Title1
text I want

							

								
								

									千问APP
									
阿里最强大模型官方AI助手
								
								下载 
							
						
text I want
Title2
text I want
text I want
text I want
Title3
text I want
text I want

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

[{'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. 核心抓取策略

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

1. 识别所有H2标题： 作为内容的逻辑分隔符和键。
2. 识别所有P标签： 作为要抓取的内容片段。
3. 建立P标签与H2标题的关联： 对于每个P标签，我们需要确定它属于哪个H2标题。这里将利用XPath的preceding-sibling::h2[1]轴来查找每个P标签最近的前一个H2同级元素。
4. 聚合内容： 将属于同一个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 = '''
Title1
text I want
text I want
Title2
text I want
text I want
text I want
Title3
text I want
text I want
'''
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 = '''
Title1
text I want
text I want
Title2
text I want
text I want
text I want
Title3
text I want
text I want
'''
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来抓取网页中具有层级关联的标题和内容，并将它们转化为易于分析和使用的结构化数据。