Создание HTML-документа – Создать или загрузить HTML на С#

Эта статья предлагает подробное руководство по созданию HTML-документа. Aspose.HTML для .NET API предоставляет класс HTMLDocument, который является корнем иерархии HTML и содержит все содержимое.

HTML-документ

HTMLDocument является отправной точкой для библиотеки классов Aspose.HTML. Вы можете загрузить HTML-страницу в объектную модель документа (DOM) ​​с помощью класса HTMLDocument, а затем программно читать, изменять дерево документа, добавлять и удалять узлы, изменять свойства узла в документе, как это описано в официальных спецификациях.

Класс HTMLDocument обеспечивает представление в памяти HTML DOM и полностью основан на W3C DOM и WHATWG DOM, которые поддерживаются многими современными браузерами. Если вы знакомы с WHATWG DOM, WHATWG HTML и JavaScript, вам будет очень удобно использовать библиотеку Aspose.HTML. В противном случае вы можете посетить www.w3schools.com, где вы можете найти множество примеров и учебных пособий по работе с HTML-документами.

HTML-документы могут быть созданы с нуля как пустой документ со структурой HTML, из строки, из потока памяти или загружены из файла или URL-адреса. HTMLDocument имеет несколько перегруженных конструкторов, позволяющих создавать или загружать HTML-документы.

Создайте пустой HTML-документ

После создания объекта документа его можно позже заполнить элементами HTML. В следующем фрагменте кода показано использование конструктора HTMLDocument() по умолчанию для создания пустого HTML-документа и его сохранения в файл.

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

После создания появляется файл create-empty-document.html с исходной структурой документа: пустой документ включает такие элементы, как <html>, <head> и <body>. Подробнее о сохранении HTML-файлов читайте в статье Сохранить HTML-документ.

Создать новый HTML-документ

Если вы хотите сгенерировать документ программно с нуля, используйте конструктор без параметров, как указано в следующем фрагменте кода:

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

В новом документе мы создали текстовый узел, учитывая указанную строку, используя CreateTextNode() метод и добавил его в элемент body с помощью метода AppendChild(). Как редактировать HTML-файл, подробно описано в статье Редактировать HTML-документ.

Загрузить из файла

Следующий фрагмент кода показывает, как загрузить HTMLDocument из существующего файла:

 1using System;
 2using Aspose.Html;
 3...
 4     // Prepare an output path for a file saving
 5	 var htmlFile = Path.Combine(OutputDir, "load-from-file.html");
 6
 7    // Prepare a 'load-from-file.html' document
 8    File.WriteAllText(htmlFile, "Hello World!");
 9
10    // Load from the 'load-from-file.html' 
11    using (var document = new HTMLDocument(htmlFile))
12    {
13        // Write the document content to the output stream
14        Console.WriteLine(document.DocumentElement.OuterHTML);
15    }

В приведенном выше примере HTML-документ загружается из файла с помощью конструктора HTMLDocument(string). Если вам требуется загрузить существующий HTML-файл с диска, обработать и сохранить его, то вам поможет следующий фрагмент кода.

 1using System.IO;
 2using Aspose.Html;
 3...
 4    // Prepare a path to a file
 5	string documentPath = Path.Combine(DataDir, "Sprite.html");
 6
 7    // Initialize an HTML document from a file
 8    using (var document = new HTMLDocument(documentPath))
 9    {
10        // Work with the document
11
12        // Save the document to a disk
13        document.Save(Path.Combine(OutputDir, "Sprite_out.html"));
14    }

Загрузить с URL-адреса

Возможность выбирать файлы и взаимодействовать с ними на локальном устройстве пользователя – одна из наиболее часто используемых функций Интернета. В следующем фрагменте кода показано, как загрузить веб-страницу в HTMLDocument.

В случае, если вы передадите неправильный URL-адрес, который недоступен в данный момент, библиотека выдает DOMException со специализированным код «NetworkError», чтобы сообщить вам, что выбранный ресурс не может быть найден.

1using System;
2using Aspose.Html;
3...
4    // Load a document from 'https://docs.aspose.com/html/net/creating-a-document/document.html' web page
5    using (var document = new HTMLDocument("https://docs.aspose.com/html/net/creating-a-document/document.html"))
6    {
7        // Write the document content to the output stream
8        Console.WriteLine(document.DocumentElement.OuterHTML);
9    }

В приведенном выше примере мы указали файл document.html для загрузки с URL-адреса.

Загрузить из HTML-кода

Если вы подготавливаете HTML-код в виде файла [System.String] в памяти ( https://docs.microsoft.com/en-us/dotnet/api/system.string?view=netframework-4.8) или System.IO.Stream, вам не нужно сохранять их в файл, просто передайте ваш HTML-код в специализированные конструкторы.

Если в вашем HTML-коде есть связанные ресурсы (стили, скрипты, изображения и т. д.), вам необходимо передать корректный параметр baseUrl конструктору документа. Он будет использоваться для определения местоположения ресурса во время загрузки документа.

Загрузить из строки

Вы можете создать документ из строкового содержимого, используя конструктор HTMLDocument(string, string). Если вам нужно создать документ из пользовательской строки непосредственно в вашем коде и сохранить его в файл, вам может помочь следующий пример: мы создаем HTML-документ, который содержит «Hello World!» текст.

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

Загрузка из потока

Чтобы создать HTML-документ из потока, вы можете использовать конструктор HTMLDocument(stream, string) :

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

SVG-документ

Поскольку масштабируемая векторная графика (SVG) является частью стандартов W3C и может быть встроена в HTMLDocument, мы внедрили SVGDocument и все его функциональность. Наша реализация основана на официальной спецификации SVG 2, поэтому вы можете загружать, читать и манипулировать документами SVG так, как это официально описано.

Поскольку SVGDocument и HTMLDocument основаны на одном и том же стандарте WHATWG DOM, все операции, такие как загрузка, чтение, редактирование, преобразование и сохранение, аналогичны для обоих документов. Таким образом, все примеры, где вы видите манипуляции с HTMLDocument, применимы и к SVGDocument.

Вы можете создать документ из строкового содержимого, используя конструктор SVGDocument (string, string). Если вы хотите загрузить документ SVG из переменной System.String в памяти и вам не нужно сохранять его в файл; пример ниже показывает, как это сделать:

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

В приведенном выше примере мы создали документ SVG, содержащий круг радиусом 40 пикселей. Вы можете узнать больше о работе с документами SVG из статей главы Как работать с Aspose.SVG API.

MHTML-документ

MHTML означает MIME-инкапсуляцию совокупных документов HTML. Файл MHTML – это архив, содержащий все содержимое веб-страницы. Он хранит HTML-код веб-страницы, а также связанные ресурсы на веб-странице, которые могут включать CSS, JavaScript, изображения и аудиофайлы. Это специализированный формат для создания архивов веб-страниц, и веб-разработчики в основном используют файлы MHTML для сохранения текущего состояния веб-страницы в целях архивирования. Библиотека Aspose.HTML поддерживает этот формат, но с некоторыми ограничениями. Мы поддерживаем только операции рендеринга из MHTML в поддерживаемые форматы вывода. Дополнительные сведения вы найдете в статье Преобразование между форматами.

EPUB-документ

EPUB – это формат, поддерживаемый большинством электронных книг и совместимый с большинством устройств, на которых вы читаете: смартфонами, планшетами и компьютерами. Для формата EPUB, представляющего формат электронной публикации, действуют те же ограничения, что и для MHTML. Мы поддерживаем только операции рендеринга из EPUB в поддерживаемые выходные форматы. Дополнительные сведения вы найдете в статье Преобразование между форматами.

Асинхронные операции

Мы понимаем, что загрузка документа может быть ресурсоемкой операцией, поскольку требуется загрузка не только самого документа, но и всех связанных ресурсов и обработки всех скриптов. Итак, в следующих фрагментах кода мы покажем вам, как использовать асинхронные операции и загружать HTMLDocument, не блокируя основной поток:

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

ReadyStateChange – не единственное событие, которое может использоваться для обработки операции асинхронной загрузки, вы также можете подписаться на событие Load следующим образом:

 1using System;
 2using Aspose.Html;
 3using System.Threading;
 4...
 5    // Initialize an AutoResetEvent
 6    var resetEvent = new AutoResetEvent(false);
 7
 8	// Initialize an HTML document
 9    var document = new HTMLDocument();
10    var isLoading = false;
11
12    // Subscribe to the 'OnLoad' event
13    // This event will be fired once the document is fully loaded
14    document.OnLoad += (sender, @event) =>
15    {
16        isLoading = true;
17		resetEvent.Set();
18    };
19
20    // Navigate asynchronously at the specified Uri
21    document.Navigate("https://docs.aspose.com/html/net/creating-a-document/document.html");
22
23    // Here the document is not loaded yet
24
25    // Wait 5 seconds for the file to load
26        if (!resetEvent.WaitOne(5000))
27        {
28            Console.WriteLine("Thread works too long, more than 5000 ms");
29        }
30
31    // Here is the loaded document
32    Console.WriteLine("outerHTML = {0}", document.DocumentElement.OuterHTML);

Вы можете скачать полные примеры и файлы данных с GitHub.

Subscribe to Aspose Product Updates

Get monthly newsletters & offers directly delivered to your mailbox.