Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.
Что такое HTML DOM? – Основы HTML
Contents
[
Hide
Show
]Aspose.HTML for .NET – это библиотека .NET, которая позволяет вам получать доступ и управлять HTML DOM на C# и других языках .NET. Он предоставляет классы и методы, которые позволяют загружать и анализировать HTML-документы, перемещаться по дереву DOM, а также получать доступ и изменять элементы документа, атрибуты и содержимое.
Пожалуйста, посетите статью Редактирование документа HTML, в которой дана основная информация о том, как редактировать объектную модель документа (DOM). Вы узнаете, как создать HTML-элемент и как с ним работать, используя Aspose.HTML for .NET API.
Объектная модель документа – DOM
Объектная модель документа (DOM) представляет собой стандартный межплатформенный API-интерфейс программирования, который помогает программистам получать доступ к частям документа и изменять их. DOM определяет структуру документа как дерево с иерархией узлов, где каждый узел представляет часть документа, такую как элемент, класс, тег, атрибут или текст. Например, каждая часть, такая как изображение или часть текста, называется «узлом». Дерево DOM – это то, как или с какой структурой документ представлен в памяти. Другими словами, объектная модель документа создает логическую структуру документа и определяет объекты, свойства, события и методы для доступа к ним и их изменения.
HTML DOM
HTML DOM – это API для представления HTML-документа, который позволяет вам получать доступ и управлять содержимым HTML-документа. Он обеспечивает древовидную структуру документа, где каждый элемент представлен в виде узла дерева. Каждая ветвь дерева заканчивается узлом, и каждый узел содержит объекты. HTML DOM реализован в качестве стандарта Консорциумом World Wide Web (W3C) и поддерживается всеми современными веб-браузерами. Он обеспечивает последовательный и стандартизированный способ доступа к элементам HTML и управления ими, что делает его эффективным инструментом для создания динамических и интерактивных веб-страниц.
HTML DOM – это модель документа, загруженная в браузер и представляющая документ в виде дерева узлов, где каждый узел представляет часть документа, например элемент, текстовую строку или комментарий. Мы описываем элементы в дереве так же, как и в генеалогическом дереве – есть предки, потомки, родители и дети. Например, документ HTML со следующей структурой (рис. 1) будет представлен DOM-деревом с объектом document наверху, дочерними узлами для элемента <html>, дочерним узлом для элемента <head> и так далее.
1<html>
2 <head>
3 <title>HTML document tree</title>
4 </head>
5 <body>
6 <h1>HTML DOM</h1>
7 <p>HTML DOM is a programming interface for HTML documents.</p>
8 </body>
9</html>
Зачем нужна DOM?
Давайте укажем на несколько аспектов того, зачем нужна DOM:
- Во-первых, DOM основана на стандарте и поддерживается всеми современными веб-браузерами. Это делает ее надежным способом доступа и управления содержимым веб-страниц в разных браузерах и платформах.
- DOM обеспечивает манипулирование содержимым документа HTML. Каждый объект дерева DOM определяет методы, свойства и события для доступа и изменения. Таким образом, разработчики могут создавать динамические и интерактивные веб-страницы, которые могут обновляться и изменяться в ответ на действия пользователя или другие события.
- DOM позволяет поисковым системам и другим инструментам понимать структуру и содержание веб-страницы, что очень важно при индексировании и поиске страницы.
- DOM позволяет инструментам доступности понимать веб-страницу и взаимодействовать с ней, делая ее доступной для людей с ограниченными возможностями, что очень важно.
- И, наконец, DOM определяет события на основе действий пользователя, таких как клики, движения мыши и отправка форм, и предоставляет способ манипулирования элементами в ответ на события.
Таким образом, HTML DOM является стандартом для получения, изменения, добавления или удаления элементов HTML. Кроме того, DOM позволяет веб-страницам быть динамичными и интерактивными, позволяя поисковым системам и инструментам доступности понимать их и взаимодействовать с ними.
Доступ к HTML DOM с помощью C#
HTML DOM определяет элементы HTML как объекты, предоставляя набор свойств и методов, которые можно использовать для доступа к ним и управления ими. Каждый элемент в документе HTML представлен узлом в дереве DOM, и каждый узел имеет собственный набор свойств и методов. Как объектно-ориентированное представление веб-страницы, его можно изменить с помощью библиотеки C# Aspose.HTML.
Как HTML DOM определяет элементы HTML как объекты?
Aspose.HTML for .NET предоставляет набор классов и методов, которые позволяют вам получать доступ и управлять HTML DOM на C#. Вы можете использовать класс
HTMLDocument для загрузки и анализа HTML-документа. Например, вы можете использовать следующий код для загрузки файла HTML и доступа к элементу <body> документа:
1using Aspose.Html;
2...
3
4 using var document = new HTMLDocument(documentPath);
5 var body = document.Body;Свойства DOM
Давайте посмотрим на пример C#, как использовать класс HTMLDocument для доступа к DOM и изменения содержимого файла HTML. В следующем примере C# свойство document.Body.InnerHTML используется для доступа к элементу <body>. Он представляет содержимое элемента <body> документа, и вы можете использовать свойство
InnerHtml, например, чтобы получить или установить внутренний HTML-код элемента.
1using Aspose.Html;
2using System.IO;
3...
4
5 // Prepare a path to a source HTML file
6 string documentPath = Path.Combine(DataDir, "document.html");
7
8 // Prepare a path for edited file saving
9 string savePath = Path.Combine(OutputDir, "document-edited.html");
10
11 // Initialize an HTML document from the file
12 using var document = new HTMLDocument(documentPath);
13
14 // Write the content of the HTML document into the console output
15 Console.WriteLine(document.DocumentElement.OuterHTML); // output: <html><head></head><body>Hello, World!</body></html>
16
17 // Edit the content of the body element
18 document.Body.InnerHTML = "<p>HTML is the standard markup language for Web pages.</p>";
19
20 // Write the content of the HTML document into the console output
21 Console.WriteLine(document.DocumentElement.OuterHTML); // output: <html><head></head><body><p>HTML is the standard markup language for Web pages.</p></body></html>
22
23 // Save the edited HTML file
24 document.Save(savePath);В приведенном выше примере C# мы выполняем следующие шаги:
- Мы объявляем переменные
documentPathиsavePath, которые устанавливают путь к исходному и конечному файлу HTML. - Затем мы создаем экземпляр класса
HTMLDocumentс помощью конструктораHTMLDocument(documentPath)и открываем документ для редактирования. - Мы используем метод
WriteLine()для вывода OuterHTML свойстваDocumentElement, которое представляет элемент<html>. - Мы присваиваем новое строковое значение свойству
document.Body.InnerHTML, которое представляет содержимое элемента<body>. - Затем мы выводим свойство
OuterHTMLпосле изменения, используя методWriteLine(). - Наконец, мы сохраняем отредактированный файл HTML, вызывая метод Save(savePath).
Методы DOM
HTML DOM определяет набор методов, которые можно использовать для доступа и управления всеми элементами HTML. Вы можете использовать эти методы для выполнения различных задач, таких как создание, изменение и удаление элементов, а также управление их свойствами и событиями. Например, наиболее часто используемые методы:
- класс Document предоставляет такие методы, как GetElementById(), GetElementsByTagName(), CreateElement (), CreateTextNode() и другие.
- класс Element предоставляет методы SetAttribute(), GetAttribute(), QuerySelector() , Remove() и другие.
- класс Node предоставляет методы AppendChild(), InsertBefore(), RemoveChild() и т. д.
Давайте посмотрим на пример C#, демонстрирующий, как использовать класс HTMLDocument для создания новых элементов и текстовых узлов и как использовать метод AppendChild() для их добавления в HTML-документ.
1using Aspose.Html;
2using System.IO;
3...
4
5 // Prepare a path for edited file saving
6 string savePath = Path.Combine(OutputDir, "dom.html");
7
8 // Initialize an empty HTML document
9 using var document = new HTMLDocument();
10
11 // Declare a variable body that references the <body> element
12 var body = document.Body;
13
14 // Create an <h1> element with text content
15 var h1 = document.CreateElement("h1");
16 var text1 = document.CreateTextNode("HTML DOM");
17 h1.AppendChild(text1);
18
19 // Create a <p> element with text content
20 var p = document.CreateElement("p");
21 var text2 = document.CreateTextNode("HTML Document Object Model is a programming interface for HTML documents.");
22 p.AppendChild(text2);
23
24 // Add new elements into <body>
25 body.AppendChild(h1);
26 body.AppendChild(p);
27
28 // Save the document to a file
29 document.Save(savePath);Класс
HTMLDocument предоставляет основную точку входа для работы с DOM, он позволяет загружать и анализировать HTML-документы и узлы доступа DOM-дерева. В примере мы использовали класс HTMLDocument для создания нового HTML-документа, а методы CreateElement() и CreateTextNode() класса HTMLDocument для создания новых элементов и текстовых узлов.
Aspose.HTML предлагает бесплатные Веб-приложения HTML, которые представляют собой онлайн-коллекцию конвертеров, слияний, загрузчиков, инструментов SEO, генераторов HTML-кода, инструментов URL и др. Приложения работают в любой операционной системе с веб-браузером и не требуют установки дополнительного программного обеспечения. Легко конвертируйте, объединяйте, кодируйте, генерируйте HTML-код, извлекайте данные из Интернета или анализируйте веб-страницы с точки зрения SEO, где бы вы ни находились. Используйте нашу коллекцию веб-приложений HTML, чтобы выполнять повседневные дела и сделать свой рабочий процесс безупречным!
