用 Python 编辑 HTML 文档

DOM 命名空间

Aspose.HTML for Python via .NET 允许您用 Python 语言访问和操作 HTML DOM(文档对象模型)。Aspose.html.dom 命名空间 提供了与 HTML、XML 和 SVG 文档交互的 API。它将文档表示为节点树，每个节点代表文档的一部分，如元素、文本字符串或注释。该命名空间包括 Attr、 CharacterData、 Comment 等类，每个类在文档模型中都有特定的用途。

Document 类代表整个 HTML、XML 或 SVG 文档，是文档树的根。其他类，如 Element、 Node、 DocumentFragment 和 EventTarget 提供了对文档不同部分的访问，并允许对文档数据进行操作和交互。该 API 基于 WHATWG DOM标准。因此，只要具备 HTML 和 JavaScript 语言的基础知识，就可以通过 .NET 轻松使用 Aspose.HTML for Python。

编辑 HTML

要使用 DOM 树编辑 HTML 文档，请使用 HTMLDocument 类，它代表整个文档。使用我们的 Python 库，您可以通过多种方式编辑 HTML。您可以通过插入新节点、删除或编辑现有节点的内容来修改文档。如果需要创建新元素或节点，需要调用以下方法：

• create_element(local_name) 用于生成新元素，如 <style> 和 <p>；
• get_elements_by_tag_name(tagname) 获取给定 tagname 的现有元素列表；
• get_element_by_id(element_id)用于返回具有指定 ID 属性并带有给定值的第一个元素；
• create_text_node(data) 用于添加文本内容。

要操作元素属性，请使用方法：

• set_attribute(qualified_name, value)添加一个新属性并设置其值。如果元素中已存在该名称的属性，则其值将改为参数 value 的值；
• get_attribute(qualified_name) 按名称检索属性值。

创建新节点后，DOM 中有几种方法可以帮助您在文档树中插入节点。下面列出了插入或删除节点的最常用方法：

• append_child(node) 方法用于向现有元素添加元素或节点；
• [insert_beforenode, child)](https://reference.aspose.com/html/python-net/aspose.html.dom/node/insert_before/) 方法会将 node插入现有的子节点child之前。如果child为空，则在子节点列表的末尾插入一个node` 。
• remove() 方法会将此实例从 HTML DOM 树中删除。
• remove_child(child) 方法会从子节点列表中删除子节点。

有关 DOM 命名空间中代表的类和方法的完整列表，请访问 API 参考源。

编辑文档树

Aspose.HTML Python API 支持 HTML 标准中定义的一系列 HTML 元素，以及元素嵌套规则。考虑使用简单的步骤从头开始创建 HTML 并使用 DOM 树和上述功能对其进行编辑。文档将包含一个带有 id 属性的文本段落：

• 使用 HTMLDocument() 构造函数创建 HTML 文档实例。
• HTMLDocument 类的 body 属性指向文档的 元素。
• 使用 HTMLDocument 的 create_element() 方法创建段落元素 <p>。
• 使用 set_attribute() 方法为段落元素设置 id 属性。
• 使用 create_text_node() 方法创建文本节点。
• 使用 append_child() 方法将此文本节点添加到段落元素中。
• 使用 append_child() 方法将段落元素添加到文档的 <body> 中。
• 将 HTML 文档保存到文件中。

这段代码演示了如何以编程方式创建一个基本的 HTML 文档，添加一个带有属性和文本的段落，并将生成的 HTML 保存到文件中：

# Edit an HTML document using the DOM in Python

import os
import aspose.html as ah

# Prepare the output path
output_dir = "output"
output_path = os.path.join(output_dir, "edit-document-tree.html")
os.makedirs(output_dir, exist_ok=True)

# Create and edit the HTML document
with ah.HTMLDocument() as document:
    paragraph = document.create_element("p")
    paragraph.set_attribute("id", "my-paragraph")

    text = document.create_text_node(
        "The Aspose.Html.Dom namespace provides an API for representing and "
        "interfacing with HTML, XML, or SVG documents."
    )
    paragraph.append_child(text)
    document.body.append_child(paragraph)

    # Save the edited HTML document
    document.save(output_path)

让我们来创建一个更复杂的 HTML 文档。在下面的代码片段中，我们将从头开始构建一个 HTML 文档，创建新元素，为它们填充内容，并将它们添加到 HTML 文档结构中。HTML DOM 模型和上述功能将帮助我们完成这项工作。

• 使用 HTMLDocument() 构造函数初始化一个新的 HTMLDocument 对象，它代表 HTML 文档。
• 使用 HTMLDocument 的 create_element() 方法生成一个 <style> 元素。
• 使用 text_content 属性为样式元素指定 CSS 规则。
• 使用 get_elements_by_tag_name() 方法读取 <head> 元素。
• 使用 append_child() 方法将 <style> 元素追加到 <head> 元素。
• 使用 create_element() 方法创建一个 <p> 段落元素。
• 设置段落的 class_name 属性，以应用所需的 CSS 样式。
• 使用 create_text_node() 方法创建文本节点。
• 使用 append_child() 方法将此文本节点附加到段落元素。
• 使用 body 属性上的 append_child() 方法，将段落元素添加到文档的 <body> 中。
• 调用 HTMLDocument 的 save() 方法，将文档保存到指定的 HTML 文件路径。

# Create HTML elements using the DOM in Python

import os
import aspose.html as ah

# Prepare the output path
output_dir = "output"
save_path = os.path.join(output_dir, "edit-document.html")
os.makedirs(output_dir, exist_ok=True)

# Create an HTML document and add new elements
with ah.HTMLDocument() as document:
    style = document.create_element("style")
    style.text_content = ".col { color: teal }"
    head = document.get_elements_by_tag_name("head")[0]
    head.append_child(style)

    paragraph = document.create_element("p")
    paragraph.class_name = "col"
    paragraph.append_child(document.create_text_node("Edit HTML document"))
    document.body.append_child(paragraph)

    # Save the HTML document
    document.save(save_path)

API Reference Source 提供了 DOM 命名空间中类和方法的完整列表。

使用 inner_html 和 outer_html 属性

使用 DOM 对象为在 Python 中操作 HTML 文档提供了一种强大的方法。然而，在某些情况下，直接使用字符串会更方便。inner_html “和 “outer_html “属性用于访问和操作文档中的 HTML 内容，但它们在表示的内容和使用的方式上有所不同：

1. inner_html 属性表示元素内部的 HTML 内容，不包括元素自身的开始和结束标记。
2. outer_html 属性表示元素的所有 HTML 内容，包括其自身的开始和结束标记。

以下代码片段演示了如何使用 Element 类的 inner_html 和 outer_html 属性编辑 HTML。

# Edit HTML with innerHTML and outerHTML in Python

import aspose.html as ah

# Create an HTML document and inspect its markup
with ah.HTMLDocument() as document:
    print(document.document_element.outer_html)

    # Replace the body content using innerHTML
    document.body.inner_html = "<p>HTML is the standard markup language for Web pages.</p>"
    paragraph = document.get_elements_by_tag_name("p")[0]

    # Print the element content and updated document markup
    print(paragraph.inner_html)
    print(document.document_element.outer_html)

编辑 CSS

层叠样式表(CSS)是一种样式表语言，用于描述网页在浏览器中的显示方式。CSS 可以通过内联、内部和外部方式添加到 HTML 文档中。因此，您可以使用内联 CSS 为单个 HTML 元素定义独特的样式，也可以通过在单独的 .css 文件中指定相关 CSS 来为多个网页共享格式。Aspose.HTML for Python via .NET不仅支持开箱即用的CSS，而且在将HTML文档转换为其他格式之前，还为您提供了即时处理文档样式的工具，如下所示。

内联 CSS

在 HTML 标签内使用 style 属性编写 CSS 时，称为 “内联 CSS”。内联 CSS 可让你一次对一个 HTML 元素应用一个单独的样式。您可以使用 style 属性为 HTML 元素设置 CSS，并在其中定义 CSS 属性。 在下面的代码片段中，你可以看到如何为 HTML <p> 元素指定 CSS 样式属性。

# Add inline CSS to HTML in Python

import os
import aspose.html as ah
import aspose.html.rendering.pdf as rp

# Define the HTML content
content = "<p>Edit inline CSS using Aspose.HTML for Python via .NET</p>"

# Prepare output paths
output_dir = "output"
os.makedirs(output_dir, exist_ok=True)
html_path = os.path.join(output_dir, "edit-inline-css.html")
pdf_path = os.path.join(output_dir, "edit-inline-css.pdf")

# Add inline CSS, then save and render the document
with ah.HTMLDocument(content, ".") as document:
    paragraph = document.get_elements_by_tag_name("p")[0]
    paragraph.set_attribute("style", "font-size: 150%; font-family: arial; color: teal")
    document.save(html_path)

    with rp.PdfDevice(pdf_path) as device:
        document.render_to(device)

在本例中，颜色、字体大小和字体家族适用于 <p> 元素。呈现的 pdf 页面片段如下：

内部 CSS

内部 CSS 样式选项通过将所有样式封装在 HTML 文档的<head> 中的<style>元素中，将属性应用于单个页面，因此很受欢迎。

# Add internal CSS to HTML in Python

import os
import aspose.html as ah
import aspose.html.rendering.pdf as rp

# Define the HTML content
content = "<div><h1>Internal CSS</h1><p>An internal CSS is used to define a style for a single HTML page</p></div>"

# Prepare output paths
output_dir = "output"
os.makedirs(output_dir, exist_ok=True)
html_path = os.path.join(output_dir, "edit-internal-css.html")
pdf_path = os.path.join(output_dir, "edit-internal-css.pdf")

# Add internal CSS, then save and render the document
with ah.HTMLDocument(content, ".") as document:
    style = document.create_element("style")
    style.text_content = (
        ".frame1 { margin-top:50px; margin-left:50px; padding:25px; width:360px; height:90px; "
        "background-color:#82011a; font-family:arial; color:#fff5ee;} \r\n"
        ".frame2 { margin-top:-70px; margin-left:160px; text-align:center; padding:20px; width:360px; "
        "height:100px; background-color:#ebd2d7;}"
    )
    head = document.get_elements_by_tag_name("head")[0]
    head.append_child(style)

    header = document.get_elements_by_tag_name("h1")[0]
    header.class_name = "frame1"
    header.set_attribute("style", "font-size: 200%; text-align: center;")

    paragraph = document.get_elements_by_tag_name("p")[0]
    paragraph.class_name = "frame2"
    paragraph.set_attribute("style", "color: #434343; font-size: 150%; font-family: verdana;")

    document.save(html_path)
    with rp.PdfDevice(pdf_path) as device:
        document.render_to(device)

在本例中，我们使用了内部 CSS，并在 <h1> 和 <p> 标记内使用 style 属性为单个元素声明了额外的样式属性。下图展示了 “edit-internal-css.pdf “文件的渲染片段：

您可以从 GitHub 下载完整的示例和数据文件。

下载 Aspose.HTML for Python via .NET 库，即可成功、快速、轻松地处理 HTML 文档。Python 库可以创建、修改、提取数据、转换和渲染 HTML 文档，而无需外部软件。它支持 EPUB、MHTML、XML、SVG 和 Markdown 等流行文件格式，并可渲染为 PDF、DOCX、XPS 和图像文件格式。