Редактировать HTML-документ
Пространство имен DOM
Aspose.HTML for Python via .NET позволяет вам получать доступ к HTML DOM (объектной модели документа) и манипулировать ею на языке Python. Пространство имен aspose.html.dom предоставляет API для взаимодействия с документами HTML, XML и SVG. Он представляет документ как дерево узлов, где каждый узел представляет часть документа, например элемент, текстовую строку или комментарий. Пространство имен включает в себя такие классы, как Attr, CharacterData, Comment и другие, каждый из которых служит определенным целям в модели документа.
Класс Document представляет весь документ HTML, XML или SVG и служит корнем дерева документов. Другие классы, такие как Element, Node, DocumentFragment и EventTarget, предоставляют доступ к различным частям документа и позволяют манипулировать данными документа и взаимодействовать с ними. API основан на стандарте WHATWG DOM. Таким образом, легко использовать Aspose.HTML for Python via .NET, имея базовые знания языков HTML и JavaScript.
Редактировать HTML
Чтобы редактировать HTML-документ с помощью дерева DOM, используйте класс HTMLDocument, который представляет весь документ. Существует множество способов редактирования HTML с помощью нашей библиотеки Python. Вы можете изменить документ, вставив новые узлы, удалив или отредактировав содержимое существующих узлов. Если вам нужно создать новый элемент или узел, необходимо вызвать следующие методы:
- create_element(
local_name) для создания новых элементов, таких как<style>и<p>; - get_elements_by_tag_name(
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_before(
node, child) вставляетnodeперед существующим дочерним узломchild. Еслиchildимеет значение null,nodeвставляется в конец списка дочерних элементов. - Метод remove() удаляет этот экземпляр из дерева HTML DOM.
- Метод
remove_child(
child) удаляет дочерний узел из списка дочерних узлов.
Полный список классов и методов, представленных в пространстве имен DOM, можно найти на странице Справочник API.
Редактировать дерево документа
Python API Aspose.HTML поддерживает набор HTML-элементов, определенных в стандарте HTML, а также правила вложения элементов. Рассмотрим простые шаги по созданию HTML с нуля и его редактированию с помощью DOM-дерева и упомянутого выше функционала. Документ будет содержать текстовый абзац с атрибутом id:
- Используйте конструктор HTMLDocument() для создания экземпляра HTML-документа.
- Свойство body класса
HTMLDocument указывает на элемент
<body>документа. - Используйте метод
create_element() класса
HTMLDocument, чтобы создать элемент абзаца<p>. - Используйте метод
set_attribute(), чтобы установить атрибут
idдля элемента абзаца. - Создайте текстовый узел с помощью метода create_text_node().
- Добавьте этот текстовый узел к элементу абзаца, используя метод append_child().
- Добавьте элемент абзаца в
<body>документа, используя методappend_child(). - Сохраните HTML-документ в файл.
Этот код демонстрирует, как программно создать базовый HTML-документ, добавить абзац с атрибутом и текстом и сохранить полученный HTML-код в файл:
1import os
2from aspose.html import *
3
4# Define the output directory and file path
5output_dir = "output/"
6output_path = os.path.join(output_dir, "edit-document-tree.html")
7
8# Ensure the output directory exists
9os.makedirs(output_dir, exist_ok=True)
10
11# Create an instance of an HTML document
12document = HTMLDocument()
13
14# Access the document <body> element
15body = document.body
16
17# Create a paragraph element <p>
18p = document.create_element("p")
19
20# Set a custom attribute
21p.set_attribute("id", "my-paragraph")
22
23# Create a text node
24text = document.create_text_node("The Aspose.Html.Dom namespace provides an API for representing and interfacing with HTML, XML, or SVG documents.")
25
26# Add the text to the paragraph
27p.append_child(text)
28
29# Attach the paragraph to the document body
30body.append_child(p)
31
32# Save the HTML document to a file
33document.save(output_path)Давайте посмотрим на создание более сложного HTML-документа. В следующем фрагменте кода мы создадим HTML-документ с нуля, создадим новые элементы, наполним их содержимым и добавим их в структуру HTML-документа. В этом нам поможет модель HTML DOM и упомянутый выше функционал.
- Используйте конструктор HTMLDocument() для инициализации нового объекта HTMLDocument, который представляет HTML-документ.
- Используйте метод
create_element() класса
HTMLDocumentдля создания элемента<style>. – Назначьте правила CSS элементу стиля с помощью свойства text_content. - Получите элемент
<head>с помощью метода get_elements_by_tag_name(). - Добавьте элемент
<style>к элементу<head>с помощью метода append_child(). - Используйте метод
create_element() для создания элемента абзаца
<p>. – Установите свойство class_name абзаца, чтобы применить нужные стили CSS. - Создайте текстовый узел с помощью метода create_text_node().
- Добавьте этот текстовый узел к элементу абзаца, используя метод
append_child(). - Добавьте элемент абзаца в
<body>документа, используя методappend_child()в свойствеbody. - Вызовите метод save() класса HTMLDocument, чтобы сохранить документ по указанному пути к файлу HTML.
1import os
2from aspose.html import *
3from aspose.html.saving import *
4
5# Define output directory and file paths
6output_dir = "output/"
7save_path = os.path.join(output_dir, "edit-document.html")
8
9# Ensure the output directory exists
10os.makedirs(output_dir, exist_ok=True)
11
12# Create an instance of an HTML document
13document = HTMLDocument()
14
15# Create a style element and set the teal color for elements with class "col"
16style = document.create_element("style")
17style.text_content = ".col { color: teal }"
18
19# Find the document <head> element and append the <style> element
20head = document.get_elements_by_tag_name("head")[0]
21head.append_child(style)
22
23# Create a paragraph <p> element with class "col"
24p = document.create_element("p")
25p.class_name = "col"
26
27# Create a text node
28text = document.create_text_node("Edit HTML document")
29
30# Append the text node to the paragraph
31p.append_child(text)
32
33# Append the paragraph to the document <body>
34document.body.append_child(p)
35
36# Save the HTML document to a file
37document.save(save_path)Справочник API предоставляет полный список классов и методов в пространстве имен DOM.
Использование свойств inner_html и outer_html
Работа с объектами DOM предоставляет мощный способ манипулирования HTML-документом на Python. Однако в некоторых случаях удобнее работать напрямую со строками. Свойства inner_html и outer_html используются для доступа к содержимому HTML в документе и управления им, но они различаются тем, что они представляют и как они используются:
- Свойство inner_html представляет содержимое HTML внутри элемента, исключая собственные начальный и конечный теги элемента.
- Свойство outer_html представляет все HTML-содержимое элемента, включая его собственные начальный и конечный теги.
В следующем фрагменте кода показано, как использовать свойства inner_html и outer_html класса
Element для редактирования HTML.
1from aspose.html import *
2
3# Create an instance of an HTML document
4document = HTMLDocument()
5
6# Write the content of the HTML document to the console
7print(document.document_element.outer_html) # output: <html><head></head><body></body></html>
8
9# Set the content of the body element
10document.body.inner_html = "<p>HTML is the standard markup language for Web pages.</p>"
11
12# Find the document <p> element
13p = document.get_elements_by_tag_name("p")[0]
14
15# Write the content of the <p> element to the console
16print(p.inner_html) # output: HTML is the standard markup language for Web pages.
17
18# Write the updated content of the HTML document to the console
19print(document.document_element.outer_html) # output: <html><head></head><body><p>HTML is the standard markup language for Web pages.</p></body></html>Редактировать CSS
Каскадные таблицы стилей (CSS) – это язык таблиц стилей, используемый для описания того, как веб-страницы отображаются в браузере. CSS можно добавлять в HTML-документы встроенным, внутренним и внешним способом. Таким образом, вы можете определить уникальный стиль для одного элемента HTML, используя встроенный CSS, или для нескольких веб-страниц, чтобы использовать общее форматирование, указав соответствующий CSS в отдельном файле .css. Aspose.HTML for Python via .NET не только поддерживает CSS «из коробки», но также предоставляет инструменты для управления стилями документа «на лету» перед преобразованием HTML-документа в другие форматы, как показано ниже.
Встроенный CSS
Когда CSS написан с использованием атрибута style внутри тега HTML, он называется «встроенным CSS». Встроенный CSS позволяет применять индивидуальный стиль к одному элементу HTML за раз. Вы устанавливаете CSS для элемента HTML, используя атрибут style с любыми свойствами CSS, определенными в нем.
В следующем фрагменте кода вы можете увидеть, как указать свойства стиля CSS для элемента HTML <p>.
1import os
2from aspose.html import *
3from aspose.html.rendering.pdf import *
4
5# Define the content of the HTML document
6content = "<p>Edit inline CSS using Aspose.HTML for Python via .NET</p>"
7
8# Create an instance of an HTML document with specified content
9document = HTMLDocument(content, ".")
10
11# Find the paragraph element and set a style attribute
12paragraph = document.get_elements_by_tag_name("p")[0]
13paragraph.set_attribute("style", "font-size: 150%; font-family: arial; color: teal")
14
15# Save the HTML document to a file
16output_dir = "output/"
17os.makedirs(output_dir, exist_ok=True)
18html_path = os.path.join(output_dir, "edit-inline-css.html")
19document.save(html_path)
20
21# Create an instance of the PDF output device and render the document to this device
22pdf_path = os.path.join(output_dir, "edit-inline-css.pdf")
23with PdfDevice(pdf_path) as device:
24 document.render_to(device)В этом конкретном примере цвет, размер шрифта и семейство шрифтов применяются к элементу <p>. Фрагмент отрендеренной pdf-страницы выглядит следующим образом:
Внутренний CSS
Опция внутреннего стиля CSS популярна для применения свойств к отдельным страницам путем заключения всех стилей в элемент <style>, помещающий его в <head> HTML-документов.
1import os
2from aspose.html import *
3from aspose.html.rendering.pdf import *
4
5
6# Define the content of the HTML document
7content = "<div><h1>Internal CSS</h1><p>An internal CSS is used to define a style for a single HTML page</p></div>"
8
9# Create an instance of an HTML document with specified content
10document = HTMLDocument(content, ".")
11
12# Create a <style> element and define internal CSS rules
13style = document.create_element("style")
14style.text_content = (
15 ".frame1 { margin-top:50px; margin-left:50px; padding:25px; width:360px; height:90px; "
16 "background-color:#82011a; font-family:arial; color:#fff5ee;} \r\n"
17 ".frame2 { margin-top:-70px; margin-left:160px; text-align:center; padding:20px; width:360px; "
18 "height:100px; background-color:#ebd2d7;}"
19)
20
21# Find the <head> element and append the <style> element
22head = document.get_elements_by_tag_name("head")[0]
23head.append_child(style)
24
25# Find the <h1> element and apply styles
26header = document.get_elements_by_tag_name("h1")[0]
27header.class_name = "frame1"
28
29# Update the style of <h1> using the style attribute directly
30header.set_attribute("style", "font-size: 200%; text-align: center;")
31
32# Find the paragraph element and apply styles
33paragraph = document.get_elements_by_tag_name("p")[0]
34paragraph.class_name = "frame2"
35paragraph.set_attribute("style", "color: #434343; font-size: 150%; font-family: verdana;")
36
37# Save the HTML document to a file
38output_dir = "output/"
39os.makedirs(output_dir, exist_ok=True)
40html_path = os.path.join(output_dir, "edit-internal-css.html")
41document.save(html_path)
42
43# Create an instance of the PDF output device and render the document to this device
44pdf_path = os.path.join(output_dir, "edit-internal-css.pdf")
45with PdfDevice(pdf_path) as device:
46 document.render_to(device)В этом примере мы используем внутренний CSS, а также объявляем дополнительные свойства стиля для отдельных элементов, используя атрибут style внутри тегов <h1> и <p>. На рисунке показан фрагмент отрисованного файла edit-internal-css.pdf:
Загрузите библиотеку Aspose.HTML for Python via .NET, чтобы успешно, быстро и легко манипулировать вашими HTML-документами. Библиотека Python может создавать, изменять, извлекать данные, конвертировать и отображать HTML-документы без необходимости использования внешнего программного обеспечения. Она поддерживает популярные форматы файлов, такие как EPUB, MHTML, XML, SVG и Markdown, а также может выполнять рендеринг в форматах файлов PDF, DOCX, XPS и изображений.