使用BeautifulSoup在HTML中提取带高亮标记的文本并维护其原始顺序

1. 引言：HTML文本解析与高亮识别的挑战

在处理html内容时，我们经常需要提取文本信息。一个常见的需求是识别并提取被特定html标签（如）标记的文本，同时还要保留这些文本在原始文档中的顺序，并判断它们是否具有特定的样式或属性（例如，一个class='highlight'的高亮标记）。

例如，给定以下HTML片段：

Easy to cultivate, sunflowers are a popular choice for gardeners of all skill levels.
Their large, cheerful blooms
bring a touch of summer to any outdoor space, creating a delightful atmosphere. ...

我们的目标是不仅要提取出“Easy to cultivate, sunflowers are a popular choice for gardeners of all skill levels”和“cheerful blooms”这些高亮文本，还要提取它们之间以及之后的所有普通文本，并保持所有文本段落的原始顺序，同时为每个段落标记其是否为高亮内容。

简单地使用soup.find_all('span', class_='highlight')只能找到高亮部分的元素，无法获取非高亮文本以及它们之间的相对顺序。这正是本教程将要解决的核心问题。

2. 解决方案：结合find_all(string=True)与find_parent()

BeautifulSoup库提供了强大的HTML解析能力。为了解决上述问题，我们可以利用以下两个关键方法：

立即学习“前端免费学习笔记（深入）”；

• element.find_all(string=True)：这个方法可以查找指定元素内部的所有文本节点，包括直接文本和嵌套标签内的文本。它的一个重要特性是能够返回所有文本节点，而不仅仅是特定标签内的文本。
• element.find_parent(class_='highlight')：对于一个文本节点，我们可以通过其父级元素向上追溯，判断它是否包含在具有特定类名（如highlight）的祖先元素中。

通过结合这两个方法，我们可以遍历HTML中的所有文本节点，然后对每个文本节点判断其是否属于一个高亮区域。

2.1 示例代码

以下是实现上述目标的Python代码：

一览AI绘图

一览AI绘图是一览科技推出的AIGC作图工具，用AI灵感助力，轻松创作高品质图片

下载

import pandas as pd
from bs4 import BeautifulSoup

# 原始HTML字符串
original_string = """
@@##@@\
\
Easy to cultivate, sunflowers are a popular choice for gardeners of all skill levels. \
Their large, cheerful blooms\
bring a touch of summer to any outdoor space, creating a delightful atmosphere. \
Whether you're enjoying their beauty in a garden or using them to add a splash of color to your living space, \
sunflowers are a symbol of positivity and radiance, making them a beloved part of nature's tapestry.
"""

# 使用BeautifulSoup解析HTML内容
soup = BeautifulSoup(original_string, "html.parser")

# 用于存储提取数据的列表
data = []

# 针对特定的
标签进行处理。如果HTML结构不同，可能需要调整为soup.find_all(string=True)或查找其他父元素。
# find_all(string=True)会返回所有文本节点，包括被标签分隔的普通文本和标签内部的文本。
for i, text_node in enumerate(soup.p.find_all(string=True)):
    # 清理文本，去除首尾空白符
    cleaned_text = text_node.strip()

    # 只有当清理后的文本不为空时才进行处理，避免空字符串或纯空白符条目
    if cleaned_text:
        # 判断当前文本节点是否包含在class为'highlight'的父元素中
        # text_node.find_parent(class_="highlight")会返回第一个匹配的父元素，如果没有则返回None
        # bool()函数将其转换为布尔值
        is_highlighted = bool(text_node.find_parent(class_="highlight"))

        # 将提取到的信息添加到数据列表中
        data.append(
            {
                "text_order": len(data), # 使用len(data)确保顺序号在过滤空文本后是连续的
                "text": cleaned_text,
                "highlight": is_highlighted,
            }
        )

# 将数据转换为Pandas DataFrame以便于分析和展示
df = pd.DataFrame(data)
print(df)

2.2 代码解析

1. HTML解析：首先，我们使用BeautifulSoup(original_string, "html.parser")将HTML字符串解析为一个BeautifulSoup对象，以便进行DOM操作。
2. 定位目标元素：示例中，我们关注

   标签内的文本。因此，我们使用soup.p来获取该段落元素。如果你的目标文本可能在其他标签内，或者需要处理整个文档，你可以调整这个选择器（例如，直接使用soup.find_all(string=True)）。

3. 遍历所有文本节点：soup.p.find_all(string=True)是此解决方案的核心。它会返回

   标签内所有独立的文本节点。例如，对于Their large, cheerful blooms，它会返回三个文本节点："Their large, "、"cheerful blooms"和""（