HTML-Dokument in Python bearbeiten

DOM-Namensraum

Aspose.HTML for Python via .NET ermöglicht Ihnen den Zugriff auf und die Bearbeitung von HTML DOM (Document Object Model) in der Sprache Python. Der aspose.html.dom Namespace bietet eine API für die Interaktion mit HTML-, XML- und SVG-Dokumenten. Er stellt das Dokument als Knotenbaum dar, wobei jeder Knoten einen Teil des Dokuments repräsentiert, z. B. ein Element, einen Textstring oder einen Kommentar. Der Namespace umfasst Klassen wie Attr, CharacterData, Comment und andere, die jeweils einem bestimmten Zweck innerhalb des Dokumentenmodells dienen.

Die Klasse Document repräsentiert das gesamte HTML-, XML- oder SVG-Dokument und dient als Wurzel des Dokumentbaums. Andere Klassen wie Element, Node, DocumentFragment und EventTarget bieten Zugriff auf verschiedene Teile des Dokuments und ermöglichen die Manipulation und Interaktion mit den Daten des Dokuments. Die API basiert auf dem WHATWG DOM Standard. Daher ist es einfach, Aspose.HTML for Python via .NET zu verwenden, wenn man Grundkenntnisse in den Sprachen HTML und JavaScript hat.

HTML bearbeiten

Um ein HTML-Dokument mit Hilfe des DOM-Baums zu bearbeiten, verwenden Sie die Klasse HTMLDocument, die das gesamte Dokument darstellt. Es gibt viele Möglichkeiten, wie Sie HTML mit unserer Python-Bibliothek bearbeiten können. Sie können das Dokument ändern, indem Sie neue Knoten einfügen, entfernen oder den Inhalt bestehender Knoten bearbeiten. Wenn Sie ein neues Element oder einen neuen Knoten erstellen müssen, sind die folgenden Methoden aufzurufen:

create_element(local_name) zur Erzeugung neuer Elemente wie <style> und <p>;
get_elements_by_tag_name(tagname), um eine Liste der vorhandenen Elemente eines bestimmten Tagnamens zu erhalten;
get_element_by_id(element_id), um das erste Element mit einem bestimmten ID-Attribut mit dem angegebenen Wert zurückzugeben;
create_text_node(data) zum Hinzufügen von Textinhalten.

Um Elementattribute zu manipulieren, verwenden Sie die Methoden:

set_attribute(qualified_name, value) fügt ein neues Attribut hinzu und setzt seinen Wert. Wenn ein Attribut mit diesem Namen bereits in dem Element vorhanden ist, wird sein Wert in den des Parameters value geändert;
get_attribute(qualified_name) ruft den Wert eines Attributs nach seinem Namen ab.

Sobald Sie neue Knoten erstellt haben, gibt es mehrere Methoden im DOM, mit denen Sie Knoten in den Dokumentbaum einfügen können. Die folgende Liste beschreibt die gängigsten Methoden zum Einfügen oder Entfernen von Knoten:

Die Methode append_child(node) wird verwendet, um Elemente oder Knoten zu bestehenden Elementen hinzuzufügen;
Die Methode insert_before(node, child) fügt den node vor dem vorhandenen Kindknoten child ein. Wenn ein child null ist, wird ein Knoten am Ende der Liste der Kinder eingefügt.
Die Methode remove() entfernt diese Instanz aus dem HTML-DOM-Baum.
Die Methode remove_child(child) entfernt den Kindknoten aus der Liste der Kinder.

Eine vollständige Liste der im DOM-Namensraum vertretenen Klassen und Methoden finden Sie unter API-Referenzquelle.

Bearbeiten eines Dokumentenbaums

Aspose.HTML Python API unterstützt eine Reihe von HTML-Elementen, die im HTML-Standard definiert sind, zusammen mit Regeln darüber, wie die Elemente verschachtelt werden können. Betrachten Sie einfache Schritte, um HTML von Grund auf zu erstellen und es mit einem DOM-Baum und den oben genannten Funktionen zu bearbeiten. Das Dokument wird einen Textabsatz mit dem Attribut id enthalten:

Verwenden Sie den HTMLDocument() Konstruktor, um eine Instanz eines HTML-Dokuments zu erstellen.
Die Eigenschaft “body” der Klasse HTMLDocument verweist auf das Element <body> des Dokuments.
Verwenden Sie die Methode create_element() von HTMLDocument, um ein Absatzelement <p> zu erstellen.
Verwenden Sie die Methode set_attribute(), um das Attribut id für das Element paragraph zu setzen.
Erstellen Sie einen Textknoten mit der Methode create_text_node().
Fügen Sie diesen Textknoten dem Absatzelement mit der Methode append_child() hinzu.
Fügen Sie das Absatzelement in den <body> des Dokuments mit der Methode append_child() ein.
Speichern Sie das HTML-Dokument in einer Datei.

Dieser Code zeigt, wie man ein einfaches HTML-Dokument programmatisch erstellt, einen Absatz mit einem Attribut und Text hinzufügt und den resultierenden HTML-Code in einer Datei speichert:

 1# Edit an HTML document using the DOM in Python
 2
 3import os
 4import aspose.html as ah
 5
 6# Prepare the output path
 7output_dir = "output"
 8output_path = os.path.join(output_dir, "edit-document-tree.html")
 9os.makedirs(output_dir, exist_ok=True)
10
11# Create and edit the HTML document
12with ah.HTMLDocument() as document:
13    paragraph = document.create_element("p")
14    paragraph.set_attribute("id", "my-paragraph")
15
16    text = document.create_text_node(
17        "The Aspose.Html.Dom namespace provides an API for representing and "
18        "interfacing with HTML, XML, or SVG documents."
19    )
20    paragraph.append_child(text)
21    document.body.append_child(paragraph)
22
23    # Save the edited HTML document
24    document.save(output_path)

Example-EditHtmlDocument.py hosted with ❤ by GitHub

Betrachten wir nun die Erstellung eines komplexeren HTML-Dokuments. Im folgenden Codeschnipsel werden wir ein HTML-Dokument von Grund auf neu konstruieren, neue Elemente erstellen, sie mit Inhalt füllen und sie der HTML-Dokumentstruktur hinzufügen. Das HTML-DOM-Modell und die oben erwähnten Funktionen werden uns dabei helfen.

Verwenden Sie den Konstruktor HTMLDocument(), um ein neues HTMLDocument Objekt zu initialisieren, das das HTML-Dokument darstellt.
Verwenden Sie die create_element() Methode von HTMLDocument, um ein <style> Element zu erzeugen.
Weisen Sie dem Stilelement CSS-Regeln zu, indem Sie die Eigenschaft text_content verwenden.
Das Element <head> wird mit der Methode get_elements_by_tag_name() abgerufen.
Anhängen des Elements <style> an das Element <head> mit der Methode append_child().
Verwenden Sie die Methode create_element(), um ein <p> Absatzelement zu erstellen.
Setzen Sie die Eigenschaft “class_name” des Absatzes, um die gewünschten CSS-Stile anzuwenden.
Erstellen Sie einen Textknoten mit der Methode create_text_node().
Fügen Sie diesen Textknoten mit der Methode “append_child()” an das Absatzelement an.
Fügen Sie das Absatzelement in den <body> des Dokuments ein, indem Sie die Methode append_child() für die Eigenschaft body verwenden.
Rufen Sie die Methode save() von HTMLDocument auf, um das Dokument in dem angegebenen HTML-Dateipfad zu speichern.

 1# Create HTML elements using the DOM in Python
 2
 3import os
 4import aspose.html as ah
 5
 6# Prepare the output path
 7output_dir = "output"
 8save_path = os.path.join(output_dir, "edit-document.html")
 9os.makedirs(output_dir, exist_ok=True)
10
11# Create an HTML document and add new elements
12with ah.HTMLDocument() as document:
13    style = document.create_element("style")
14    style.text_content = ".col { color: teal }"
15    head = document.get_elements_by_tag_name("head")[0]
16    head.append_child(style)
17
18    paragraph = document.create_element("p")
19    paragraph.class_name = "col"
20    paragraph.append_child(document.create_text_node("Edit HTML document"))
21    document.body.append_child(paragraph)
22
23    # Save the HTML document
24    document.save(save_path)

Example-CreateHtmlDocumentUsingDom.py hosted with ❤ by GitHub

Die API-Referenzquelle enthält eine umfassende Liste der Klassen und Methoden im DOM-Namensraum.

Verwendung der Eigenschaften `inner_html` und `outer_html`

Die Arbeit mit DOM-Objekten bietet eine leistungsfähige Möglichkeit, ein HTML-Dokument in Python zu manipulieren. In einigen Fällen kann es jedoch bequemer sein, direkt mit Strings zu arbeiten. Die Eigenschaften inner_html und outer_html werden verwendet, um auf HTML-Inhalte in einem Dokument zuzugreifen und sie zu manipulieren, aber sie unterscheiden sich darin, was sie darstellen und wie sie verwendet werden:

Die Eigenschaft inner_html stellt den HTML-Inhalt innerhalb eines Elements dar, mit Ausnahme der eigenen Start- und End-Tags des Elements.
Die Eigenschaft outer_html stellt den gesamten HTML-Inhalt eines Elements dar, einschließlich seiner eigenen Start- und End-Tags.

Der folgende Codeschnipsel zeigt Ihnen, wie Sie die Eigenschaften inner_html und outer_html der Klasse Element zur Bearbeitung von HTML verwenden können.

 1# Edit HTML with innerHTML and outerHTML in Python
 2
 3import aspose.html as ah
 4
 5# Create an HTML document and inspect its markup
 6with ah.HTMLDocument() as document:
 7    print(document.document_element.outer_html)
 8
 9    # Replace the body content using innerHTML
10    document.body.inner_html = "<p>HTML is the standard markup language for Web pages.</p>"
11    paragraph = document.get_elements_by_tag_name("p")[0]
12
13    # Print the element content and updated document markup
14    print(paragraph.inner_html)
15    print(document.document_element.outer_html)

Example-UsingInnerHtmlOuterHtml.py hosted with ❤ by GitHub

CSS bearbeiten

Cascading Style Sheets (CSS) ist eine Stylesheet-Sprache, mit der beschrieben wird, wie Webseiten in einem Browser erscheinen. CSS kann HTML-Dokumenten auf Inline-, interne und externe Weise hinzugefügt werden. So können Sie einen einzigartigen Stil für ein einzelnes HTML-Element mit Inline-CSS definieren oder für mehrere Webseiten eine gemeinsame Formatierung festlegen, indem Sie das entsprechende CSS in einer separaten .css-Datei angeben. Aspose.HTML for Python via .NET unterstützt nicht nur CSS out-of-the-box, sondern gibt Ihnen auch Instrumente an die Hand, mit denen Sie Dokumentstile direkt vor der Konvertierung des HTML-Dokuments in andere Formate manipulieren können, wie im Folgenden beschrieben.

Inline-CSS

Wenn CSS mit dem Attribut style innerhalb eines HTML-Tags geschrieben wird, nennt man es “Inline-CSS”. Mit dem Inline-CSS können Sie einen individuellen Stil auf jeweils ein HTML-Element anwenden. Sie legen CSS für ein HTML-Element fest, indem Sie das Attribut style mit allen darin definierten CSS-Eigenschaften verwenden. Im folgenden Codeschnipsel sehen Sie, wie Sie CSS-Stileigenschaften für ein HTML-Element <p> festlegen können.

 1# Add inline CSS to HTML in Python
 2
 3import os
 4import aspose.html as ah
 5import aspose.html.rendering.pdf as rp
 6
 7# Define the HTML content
 8content = "<p>Edit inline CSS using Aspose.HTML for Python via .NET</p>"
 9
10# Prepare output paths
11output_dir = "output"
12os.makedirs(output_dir, exist_ok=True)
13html_path = os.path.join(output_dir, "edit-inline-css.html")
14pdf_path = os.path.join(output_dir, "edit-inline-css.pdf")
15
16# Add inline CSS, then save and render the document
17with ah.HTMLDocument(content, ".") as document:
18    paragraph = document.get_elements_by_tag_name("p")[0]
19    paragraph.set_attribute("style", "font-size: 150%; font-family: arial; color: teal")
20    document.save(html_path)
21
22    with rp.PdfDevice(pdf_path) as device:
23        document.render_to(device)

Example-EditInlineCss.py hosted with ❤ by GitHub

In diesem speziellen Beispiel gelten Farbe, Schriftgröße und Schriftart für das Element <p>. Das Fragment der gerenderten PDF-Seite sieht wie folgt aus:

Text “Inline-CSS bearbeiten”

Internes CSS

Die interne CSS-Styling-Option ist beliebt für die Anwendung von Eigenschaften auf einzelne Seiten, indem alle Stile in das <style>-Element eingeschlossen werden, das im <head> von HTML-Dokumenten platziert ist.

 1# Add internal CSS to HTML in Python
 2
 3import os
 4import aspose.html as ah
 5import aspose.html.rendering.pdf as rp
 6
 7# Define the HTML content
 8content = "<div><h1>Internal CSS</h1><p>An internal CSS is used to define a style for a single HTML page</p></div>"
 9
10# Prepare output paths
11output_dir = "output"
12os.makedirs(output_dir, exist_ok=True)
13html_path = os.path.join(output_dir, "edit-internal-css.html")
14pdf_path = os.path.join(output_dir, "edit-internal-css.pdf")
15
16# Add internal CSS, then save and render the document
17with ah.HTMLDocument(content, ".") as document:
18    style = document.create_element("style")
19    style.text_content = (
20        ".frame1 { margin-top:50px; margin-left:50px; padding:25px; width:360px; height:90px; "
21        "background-color:#82011a; font-family:arial; color:#fff5ee;} \r\n"
22        ".frame2 { margin-top:-70px; margin-left:160px; text-align:center; padding:20px; width:360px; "
23        "height:100px; background-color:#ebd2d7;}"
24    )
25    head = document.get_elements_by_tag_name("head")[0]
26    head.append_child(style)
27
28    header = document.get_elements_by_tag_name("h1")[0]
29    header.class_name = "frame1"
30    header.set_attribute("style", "font-size: 200%; text-align: center;")
31
32    paragraph = document.get_elements_by_tag_name("p")[0]
33    paragraph.class_name = "frame2"
34    paragraph.set_attribute("style", "color: #434343; font-size: 150%; font-family: verdana;")
35
36    document.save(html_path)
37    with rp.PdfDevice(pdf_path) as device:
38        document.render_to(device)

Example-EditInternalCss.py hosted with ❤ by GitHub

In diesem Beispiel verwenden wir internes CSS und deklarieren zusätzliche Stileigenschaften für einzelne Elemente, indem wir das Attribut style innerhalb der Tags <h1> und <p> verwenden. Die Abbildung veranschaulicht das Fragment der gerenderten Datei “edit-internal-css.pdf”:

Text “Internes CSS bearbeiten”

Laden Sie die Bibliothek Aspose.HTML for Python via .NET herunter, um Ihre HTML-Dokumente erfolgreich, schnell und einfach zu bearbeiten. Die Python-Bibliothek kann HTML-Dokumente erstellen, ändern, Daten extrahieren, konvertieren und rendern, ohne dass externe Software erforderlich ist. Sie unterstützt gängige Dateiformate wie EPUB, MHTML, XML, SVG und Markdown und kann in die Dateiformate PDF, DOCX, XPS und Image rendern.

Ein Dokument erstellen HTML-Dokument speichern