Erstellen eines HTML-Dokuments – HTML erstellen oder laden | C#

Dieser Artikel bietet eine detaillierte Anleitung zum Erstellen eines HTML-Dokuments. Aspose.HTML for .NET API bietet die Klasse HTMLDocument, die die Wurzel der HTML-Hierarchie ist und den gesamten Inhalt enthält.

HTML-Dokument

Das HTMLDocument ist ein Ausgangspunkt für die Aspose.HTML for .NET Bibliothek. Sie können die HTML-Seite in das Document Object Model (DOM) laden, indem Sie die HTMLDocument-Klasse verwenden, und dann programmatisch lesen, den Dokumentenbaum ändern, Knoten hinzufügen und entfernen, die Knoteneigenschaften im Dokument ändern, wie es in den offiziellen Spezifikationen beschrieben ist.

Die Klasse HTMLDocument bietet eine speicherinterne Darstellung eines HTML DOM und basiert vollständig auf den Spezifikationen W3C DOM und WHATWG DOM, die von vielen modernen Browsern unterstützt werden. Wenn Sie mit den WHATWG DOM, WHATWG HTML und JavaScript Standards vertraut sind, werden Sie Aspose.HTML for .NET ganz einfach verwenden können. Andernfalls können Sie www.w3schools.com besuchen, wo Sie eine Menge Beispiele und Tutorials zur Arbeit mit HTML-Dokumenten finden.

HTML-Dokumente können von Grund auf als leeres Dokument mit HTML-Struktur, aus einer Zeichenkette, aus einem Speicherstrom oder aus einer Datei oder einer URL geladen erstellt werden. Das HTMLDocument hat mehrere überladene Konstruktoren, mit denen Sie HTML-Dokumente erstellen oder laden können.

Ein leeres HTML-Dokument erstellen

Sobald das Dokumentobjekt erstellt ist, kann es später mit HTML-Elementen gefüllt werden. Der folgende Codeausschnitt zeigt die Verwendung des Standardkonstruktors HTMLDocument(), um ein leeres HTML-Dokument zu erstellen und es in einer Datei zu speichern.

 1// Create an empty HTML document using C#
 2
 3// Prepare an output path for a document saving
 4string documentPath = Path.Combine(OutputDir, "create-empty-document.html");
 5
 6// Initialize an empty HTML Document
 7using (HTMLDocument document = new HTMLDocument())
 8{
 9    // Work with the document
10
11    // Save the document to a file
12    document.Save(documentPath);
13}

Nach der Erstellung erscheint die Datei create-empty-document.html mit der anfänglichen Dokumentstruktur: Das leere Dokument enthält Elemente wie <html> <head> und <body>. Weitere Details zum Speichern von HTML-Dateien finden Sie im Artikel HTML-Dokument speichern.

Ein neues HTML-Dokument erstellen

Wenn Sie ein Dokument von Grund auf programmatisch erstellen möchten, verwenden Sie bitte den Konstruktor ohne Parameter, wie im folgenden Codeausschnitt angegeben:

 1// Create an HTML document using C#
 2
 3// Prepare an output path for a document saving
 4string documentPath = Path.Combine(OutputDir, "create-new-document.html");
 5
 6// Initialize an empty HTML Document
 7using (HTMLDocument document = new HTMLDocument())
 8{
 9    // Create a text node and add it to the document
10    Text text = document.CreateTextNode("Hello, World!");
11    document.Body.AppendChild(text);
12
13    // Save the document to a disk
14    document.Save(documentPath);
15}

In dem neuen Dokument haben wir mit der Methode CreateTextNode() einen Textknoten mit der angegebenen Zeichenkette erstellt und ihn mit der Methode AppendChild() zum body-Element hinzugefügt.

Wie man eine HTML-Datei bearbeitet, wird im Artikel HTML-Dokument bearbeiten ausführlich beschrieben.

Laden aus einer Datei

Das folgende Codeschnipsel zeigt, wie man das HTMLDocument aus einer bestehenden Datei lädt:

 1// Load HTML from a file using C#
 2
 3string htmlFile = Path.Combine(OutputDir, "load-from-file.html");
 4
 5// Prepare a load-from-file.html document
 6File.WriteAllText(htmlFile, "Hello, World!");
 7
 8// Load from the load-from-file.html 
 9using (HTMLDocument document = new HTMLDocument(htmlFile))
10{
11    // Write the document content to the output stream
12    Console.WriteLine(document.DocumentElement.OuterHTML);
13}

Im obigen Beispiel wurde das HTML-Dokument mit dem Konstruktor HTMLDocument (string) aus einer Datei geladen. Wenn Sie eine vorhandene HTML-Datei von einem Datenträger laden, bearbeiten und speichern möchten, hilft Ihnen der folgende Codeschnipsel.

 1// Load an HTML documment from a file using C#
 2
 3// Prepare a file path
 4string documentPath = Path.Combine(DataDir, "sprite.html");
 5
 6// Initialize an HTML document from the file
 7using (HTMLDocument document = new HTMLDocument(documentPath))
 8{
 9    // Work with the document
10
11    // Save the document to a disk
12    document.Save(Path.Combine(OutputDir, "sprite_out.html"));
13}

Laden von einer URL

Die Möglichkeit, Dateien auszuwählen und mit ihnen auf dem lokalen Gerät des Benutzers zu interagieren, ist eine der meistgenutzten Funktionen des Internets. Im nächsten Codeschnipsel sehen Sie, wie Sie eine Webseite in das HTMLDocument laden können.

Falls Sie eine falsche URL übergeben, die im Moment nicht erreichbar ist, wirft die Bibliothek die DOMException mit dem speziellen Code ‘NetworkError’ aus, um Sie zu informieren, dass die ausgewählte Ressource nicht gefunden werden kann.

 1// Load HTML from a URL using C#
 2
 3// Load a document from 'https://docs.aspose.com/html/files/document.html' web page
 4using (HTMLDocument document = new HTMLDocument("https://docs.aspose.com/html/files/document.html"))
 5{
 6    string html = document.DocumentElement.OuterHTML;
 7
 8    // Write the document content to the output stream
 9    Console.WriteLine(html);
10}

Im obigen Beispiel haben wir die Datei document.html angegeben, die von der URL geladen werden soll.

Aus HTML-Code laden

Wenn Sie einen HTML-Code als speicherinterne System.String oder System.IO.Stream Objekte vorbereiten, müssen Sie diese nicht in der Datei speichern, sondern übergeben Ihren HTML-Code einfach an spezielle Konstruktoren.

Wenn Ihr HTML-Code verknüpfte Ressourcen (Stile, Skripte, Bilder usw.) enthält, müssen Sie einen gültigen baseUrl-Parameter an den Konstruktor des Dokuments übergeben. Er wird verwendet, um den Speicherort der Ressource während des Ladens des Dokuments aufzulösen.

Laden aus einer Zeichenkette

Mit dem Konstruktor HTMLDocument (string, string) können Sie ein Dokument aus einem Stringinhalt erstellen. Wenn Sie ein Dokument aus einer Benutzerzeichenkette direkt in Ihrem Code erstellen und in einer Datei speichern möchten, könnte Ihnen das folgende Beispiel helfen: Wir erzeugen ein HTML-Dokument, das den Text “Hello, World!” enthält.

 1// Create HTML from a string using C#
 2
 3// Prepare HTML code
 4string html_code = "<p>Hello, World!</p>";
 5
 6// Initialize a document from the string variable
 7using (HTMLDocument document = new HTMLDocument(html_code, "."))
 8{
 9    // Save the document to a disk
10    document.Save(Path.Combine(OutputDir, "create-from-string.html"));
11}

Laden aus einem Stream

Um ein HTML-Dokument aus einem Stream zu erstellen, können Sie den HTMLDocument(stream, string) Konstruktor verwenden:

 1// Load HTML from a stream using C#
 2
 3// Create a memory stream object
 4using (MemoryStream mem = new MemoryStream())
 5using (StreamWriter sw = new StreamWriter(mem))
 6{
 7    // Write the HTML code into memory object
 8    sw.Write("<p>Hello, World! I love HTML!</p>");
 9
10    // It is important to set the position to the beginning, since HTMLDocument starts the reading exactly from the current position within the stream
11    sw.Flush();
12    mem.Seek(0, SeekOrigin.Begin);
13
14    // Initialize a document from the string variable
15    using (HTMLDocument document = new HTMLDocument(mem, "."))
16    {
17        // Save the document to disk
18        document.Save(Path.Combine(OutputDir, "load-from-stream.html"));
19    }
20}

SVG-Dokument

Da Scalable Vector Graphics (SVG) ein Teil des W3C Standards ist und in das HTMLDocument eingebettet werden kann, haben wir das SVGDocument und alle seine Funktionen implementiert. Unsere Implementierung basiert auf der offiziellen SVG2-Spezifikation, so dass Sie SVG-Dokumente wie offiziell beschrieben laden, lesen und manipulieren können.

Da das SVGDocument und das HTMLDocument auf demselben WHATWG DOM Standard basieren, sind alle Operationen wie das Laden, Lesen, Bearbeiten, Konvertieren und Speichern für beide Dokumente ähnlich. Daher sind alle Beispiele, in denen Sie Manipulationen mit dem HTMLDocument sehen können, auch für das SVGDocument anwendbar.

Mit dem Konstruktor SVGDocument(string, string) können Sie ein Dokument aus einem String-Inhalt erstellen. Wenn Sie das SVG-Dokument aus der speicherinternen System.String-Variablen laden wollen und es nicht in einer Datei speichern müssen, zeigt Ihnen das folgende Beispiel, wie Sie das tun können:

1// Load SVG from a string using C#
2
3// Initialize an SVG document from a string object
4using (SVGDocument document = new SVGDocument("<svg xmlns='http://www.w3.org/2000/svg'><circle cx='50' cy='50' r='40'/></svg>", "."))
5{
6    // Write the document content to the output stream
7    Console.WriteLine(document.DocumentElement.OuterHTML);
8}

Im obigen Beispiel haben wir ein SVG-Dokument erstellt, das einen Kreis mit einem Radius von 40 Pixeln enthält. Sie können mehr über die Arbeit mit SVG-Dokumenten im Kapitel So arbeiten Sie mit der Aspose.SVG-API erfahren.

MHTML-Dokument

MHTML steht für die MIME-Kapselung von zusammengefassten HTML-Dokumenten. Eine MHTML-Datei ist ein Archiv, das den gesamten Inhalt einer Webseite enthält. Es speichert den HTML-Code einer Webseite sowie die zugehörigen Ressourcen auf einer Webseite, zu denen CSS, JavaScript, Bilder und Audiodateien gehören können. Es handelt sich um ein spezielles Format zur Erstellung von Webseitenarchiven, und Webentwickler verwenden MHTML-Dateien in erster Linie, um den aktuellen Zustand einer Webseite zu Archivierungszwecken zu speichern. Die Aspose.HTML for .NET-Bibliothek unterstützt dieses Format, allerdings mit einigen Einschränkungen. Wir unterstützen nur die Rendering-Operationen von MHTML zu den unterstützten Ausgabeformaten. Für weitere Details lesen Sie bitte den Artikel Konvertierung zwischen Formaten.

EPUB-Dokument

EPUB ist ein Format, das von den meisten eReadern unterstützt wird und mit den meisten Geräten kompatibel ist, auf denen Sie lesen – Smartphones, Tablets und Computer. Für das Format EPUB, das ein elektronisches Publikationsformat darstellt, gelten die gleichen Einschränkungen wie für MHTML. Wir unterstützen nur die Rendering-Operationen von EPUB zu den unterstützten Ausgabeformaten. Für weitere Details lesen Sie bitte den Artikel Konvertierung zwischen Formaten.

Asynchrone Operationen

Wir wissen, dass das Laden eines Dokuments eine ressourcenintensive Operation sein kann, da nicht nur das Dokument selbst, sondern auch alle verknüpften Ressourcen geladen und alle Skripte verarbeitet werden müssen. In den folgenden Codeschnipseln zeigen wir Ihnen daher, wie Sie asynchrone Operationen verwenden und das HTMLDocument laden können, ohne den Hauptthread zu blockieren:

 1// Load HTML asynchronously using C#
 2
 3// Initialize an AutoResetEvent
 4AutoResetEvent resetEvent = new AutoResetEvent(false);
 5
 6// Create an instance of an HTML document
 7HTMLDocument document = new HTMLDocument();
 8
 9// Create a string variable for the OuterHTML property reading
10string outerHTML = string.Empty;
11
12// Subscribe to ReadyStateChange event
13// This event will be fired during the document loading process
14document.OnReadyStateChange += (sender, @event) =>
15{
16    // Check the value of the ReadyState property
17    // This property is representing the status of the document. For detail information please visit https://www.w3schools.com/jsref/prop_doc_readystate.asp
18    if (document.ReadyState == "complete")
19    {
20        // Fill the outerHTML variable by value of loaded document
21        outerHTML = document.DocumentElement.OuterHTML;
22        resetEvent.Set();
23    }
24};
25
26// Navigate asynchronously at the specified Uri
27document.Navigate("https://docs.aspose.com/html/files/document.html");
28
29// Here the outerHTML is empty yet
30
31Console.WriteLine($"outerHTML = {outerHTML}");
32
33//  Wait 5 seconds for the file to load
34
35// Here the outerHTML is filled 
36Console.WriteLine("outerHTML = {0}", outerHTML);

ReadyStateChange ist nicht das einzige Ereignis, das für einen asynchronen Ladevorgang verwendet werden kann, Sie können auch das Ereignis Load abonnieren, wie im Folgenden beschrieben:

 1// Handle an HTML document load using C#
 2
 3// Initialize an AutoResetEvent
 4AutoResetEvent resetEvent = new AutoResetEvent(false);
 5
 6// Initialize an HTML document
 7HTMLDocument document = new HTMLDocument();
 8bool isLoading = false;
 9
10// Subscribe to the OnLoad event
11// This event will be fired once the document is fully loaded
12document.OnLoad += (sender, @event) =>
13{
14    isLoading = true;
15    resetEvent.Set();
16};
17
18// Navigate asynchronously at the specified Uri
19document.Navigate("https://docs.aspose.com/html/files/document.html");
20
21Console.WriteLine("outerHTML = {0}", document.DocumentElement.OuterHTML);

Sie können die vollständigen Beispiele und Datendateien von GitHub herunterladen.

Subscribe to Aspose Product Updates

Get monthly newsletters & offers directly delivered to your mailbox.