Editer un document HTML en Python
Espace de noms DOM
Aspose.HTML for Python via .NET vous permet d’accéder et de manipuler le DOM (Document Object Model) HTML en langage Python. L’espace de noms aspose.html.dom fournit une API pour interagir avec les documents HTML, XML et SVG. Il représente le document sous la forme d’un arbre de nœuds, chaque nœud représentant une partie du document, telle qu’un élément, une chaîne de texte ou un commentaire. L’espace de noms comprend des classes telles que Attr, CharacterData, Comment, et d’autres encore, chacune servant des objectifs spécifiques au sein du modèle de document.
La classe Document représente l’ensemble du document HTML, XML ou SVG et sert de racine à l’arborescence du document. D’autres classes comme Element, Node, DocumentFragment et EventTarget donnent accès à différentes parties du document et permettent de manipuler et d’interagir avec les données du document. L’API est basée sur la norme WHATWG DOM. Il est donc facile d’utiliser Aspose.HTML for Python via .NET en ayant une connaissance de base des langages HTML et JavaScript.
Modifier le HTML
Pour éditer un document HTML à l’aide de l’arbre DOM, utilisez la classe HTMLDocument, qui représente le document entier. Il existe de nombreuses façons d’éditer un document HTML en utilisant notre bibliothèque Python. Vous pouvez modifier le document en insérant de nouveaux nœuds, en supprimant ou en modifiant le contenu des nœuds existants. Si vous devez créer un nouvel élément ou un nouveau nœud, les méthodes suivantes doivent être invoquées :
- create_element(
local_name
) pour générer de nouveaux éléments comme<style>
et<p>
; - get_elements_by_tag_name(
tagname
) pour récupérer une liste d’éléments existants d’un tagname donné ; - get_element_by_id(
element_id
) pour retourner le premier élément avec un attribut ID spécifié avec la valeur donnée ; - create_text_node(
data
) pour ajouter du contenu textuel.
Pour manipuler les attributs d’un élément, utilisez les méthodes :
- set_attribute(
nom_qualifié, valeur
) ajoute un nouvel attribut et fixe sa valeur. Si un attribut portant ce nom est déjà présent dans l’élément, sa valeur est remplacée par celle du paramètrevaleur
; - get_attribute(
qualified_name
) récupère la valeur d’un attribut par son nom.
Une fois que vous avez créé de nouveaux nœuds, il existe plusieurs méthodes dans le DOM qui peuvent vous aider à insérer des nœuds dans l’arbre du document. La liste suivante décrit les méthodes les plus courantes pour insérer ou supprimer des nœuds :
- La méthode
append_child(
node
) permet d’ajouter des éléments ou des nœuds à des éléments existants ; - La méthode
insert_before(
node, child
) insère lenode
avant le noeud enfantchild
existant. Si unchild
est nul, elle insère unnode
à la fin de la liste des enfants. - La méthode remove() supprime cette instance de l’arbre DOM HTML.
- La méthode
remove_child(
child
) supprime le noeud enfant de la liste des enfants.
Pour une liste complète des classes et des méthodes représentées dans l’espace de noms DOM, veuillez consulter API Reference Source.
Modifier une arborescence de documents
L’API Aspose.HTML Python prend en charge un ensemble d’éléments HTML définis dans la norme HTML, ainsi que des règles sur la manière dont les éléments peuvent être imbriqués. Considérons des étapes simples pour créer du HTML à partir de zéro et le modifier en utilisant un arbre DOM et la fonction mentionnée ci-dessus. Le document contiendra un paragraphe de texte avec un attribut id
:
- Utilisez le constructeur HTMLDocument() pour créer une instance d’un document HTML.
- La propriété
body
de la classe HTMLDocument pointe vers l’élément du document. - Employez la méthode
create_element() de
HTMLDocument
pour créer un élément paragraphe<p>
. - Utilisez la méthode
set_attribute() pour définir l’attribut
id
de l’élément paragraphe. - Créez un nœud de texte avec la méthode create_text_node().
- Ajoutez ce nœud de texte à l’élément paragraphe à l’aide de la méthode append_child().
- Ajoutez l’élément paragraphe dans le
<body>
du document en utilisant la méthodeappend_child()
. - Enregistrer le document HTML dans un fichier.
Ce code montre comment créer un document HTML de base par programme, ajouter un paragraphe avec un attribut et du texte, et enregistrer le HTML résultant dans un fichier :
1# Edit HTML document using DOM Tree in Python
2
3import os
4import aspose.html as ah
5
6# Define the output directory and file path
7output_dir = "output/"
8output_path = os.path.join(output_dir, "edit-document-tree.html")
9
10# Ensure the output directory exists
11os.makedirs(output_dir, exist_ok=True)
12
13# Create an instance of an HTML document
14document = ah.HTMLDocument()
15
16# Access the document <body> element
17body = document.body
18
19# Create a paragraph element <p>
20p = document.create_element("p")
21
22# Set a custom attribute
23p.set_attribute("id", "my-paragraph")
24
25# Create a text node
26text = document.create_text_node("The Aspose.Html.Dom namespace provides an API for representing and interfacing with HTML, XML, or SVG documents.")
27
28# Add the text to the paragraph
29p.append_child(text)
30
31# Attach the paragraph to the document body
32body.append_child(p)
33
34# Save the HTML document to a file
35document.save(output_path)
Examinons la création d’un document HTML plus complexe. Dans l’extrait de code suivant, nous allons construire un document HTML à partir de zéro, créer de nouveaux éléments, les remplir de contenu et les ajouter à la structure du document HTML. Le modèle HTML DOM et les fonctionnalités mentionnées ci-dessus nous aideront dans cette tâche.
- Utilisez le constructeur
HTMLDocument()
pour initialiser un nouvel objet HTMLDocument, qui représente le document HTML. - Employer la méthode
create_element() de
HTMLDocument
pour générer un élément<style>
. - Attribuer des règles CSS à l’élément style en utilisant la propriété text_content.
- Récupérer l’élément
<head>
en utilisant la méthode get_elements_by_tag_name(). - Ajoutez l’élément
<style>
à l’élément<head>
en utilisant la méthode append_child(). - Utilisez la méthode
create_element() pour créer un élément de paragraphe
<p>
. - Définir la propriété
class_name
du paragraphe pour appliquer les styles CSS souhaités. - Créez un nœud de texte avec la méthode create_text_node().
- Ajoutez ce nœud de texte à l’élément paragraphe en utilisant la méthode
append_child()
. - Ajoutez l’élément paragraphe dans le
<body>
du document en utilisant la méthodeappend_child()
sur la propriétébody
. - Appeler la méthode
save()
deHTMLDocument
pour enregistrer le document dans le chemin d’accès au fichier HTML spécifié.
1# Create and add new HTML elements using Python
2
3import os
4import aspose.html as ah
5
6# Define output directory and file paths
7output_dir = "output/"
8save_path = os.path.join(output_dir, "edit-document.html")
9
10# Ensure the output directory exists
11os.makedirs(output_dir, exist_ok=True)
12
13# Create an instance of an HTML document
14document = ah.HTMLDocument()
15
16# Create a style element and set the teal color for elements with class "col"
17style = document.create_element("style")
18style.text_content = ".col { color: teal }"
19
20# Find the document <head> element and append the <style> element
21head = document.get_elements_by_tag_name("head")[0]
22head.append_child(style)
23
24# Create a paragraph <p> element with class "col"
25p = document.create_element("p")
26p.class_name = "col"
27
28# Create a text node
29text = document.create_text_node("Edit HTML document")
30
31# Append the text node to the paragraph
32p.append_child(text)
33
34# Append the paragraph to the document <body>
35document.body.append_child(p)
36
37# Save the HTML document to a file
38document.save(save_path)
La Source de référence de l’API fournit une liste complète des classes et des méthodes de l’espace de noms DOM.
Utilisation des propriétés inner_html
et outer_html
Travailler avec des objets DOM est un moyen puissant de manipuler un document HTML en Python. Cependant, dans certains cas, il peut être plus pratique de travailler directement avec des chaînes de caractères. Les propriétés inner_html
et outer_html
sont utilisées pour accéder et manipuler le contenu HTML d’un document, mais elles diffèrent dans ce qu’elles représentent et comment elles sont utilisées :
- La propriété inner_html représente le contenu HTML à l’intérieur d’un élément, à l’exclusion des balises de début et de fin de l’élément.
- La propriété outer_html représente tout le contenu HTML d’un élément, y compris ses propres balises de début et de fin.
L’extrait de code suivant montre comment utiliser les propriétés inner_html
et outer_html
de la classe
Element pour éditer du HTML.
1# Edit HTML body content and get modified document as a string using Python
2
3import aspose.html as ah
4
5# Create an instance of an HTML document
6document = ah.HTMLDocument()
7
8# Write the content of the HTML document to the console
9print(document.document_element.outer_html) # output: <html><head></head><body></body></html>
10
11# Set the content of the body element
12document.body.inner_html = "<p>HTML is the standard markup language for Web pages.</p>"
13
14# Find the document <p> element
15p = document.get_elements_by_tag_name("p")[0]
16
17# Write the updated content of the HTML document to the console
18print(p.inner_html) # output: HTML is the standard markup language for Web pages.
19
20# Write the updated content of the HTML document to the console
21print(document.document_element.outer_html) # output: <html><head></head><body><p>HTML is the standard markup language for Web pages.</p></body></html>
Modifier le CSS
Les feuilles de style en cascade (CSS) sont un langage de feuille de style utilisé pour décrire la manière dont les pages web apparaissent dans un navigateur. Les feuilles de style en cascade peuvent être ajoutées aux documents HTML de manière inline, interne et externe. Ainsi, vous pouvez définir un style unique pour un seul élément HTML à l’aide d’une feuille de style en ligne ou pour plusieurs pages web afin de partager la mise en forme en spécifiant la feuille de style correspondante dans un fichier .css séparé. Aspose.HTML for Python via .NET ne prend pas seulement en charge les feuilles de style CSS prêtes à l’emploi, mais offre également des instruments permettant de manipuler les styles du document à la volée avant de convertir le document HTML dans d’autres formats, comme indiqué ci-dessous.
CSS en ligne
Lorsque le CSS est écrit à l’aide de l’attribut style
à l’intérieur d’une balise HTML, on parle de “CSS en ligne”. Le CSS en ligne vous permet d’appliquer un style individuel à un élément HTML à la fois. Vous définissez le CSS d’un élément HTML en utilisant l’attribut style
avec toutes les propriétés CSS définies à l’intérieur.
Dans l’extrait de code suivant, vous pouvez voir comment spécifier des propriétés de style CSS pour un élément HTML <p>
.
1# How to set inline CSS styles in an HTML element using Python
2
3import os
4import aspose.html as ah
5import aspose.html.rendering.pdf as rp
6
7# Define the content of the HTML document
8content = "<p>Edit inline CSS using Aspose.HTML for Python via .NET</p>"
9
10# Create an instance of an HTML document with specified content
11document = ah.HTMLDocument(content, ".")
12
13# Find the paragraph element and set a style attribute
14paragraph = document.get_elements_by_tag_name("p")[0]
15paragraph.set_attribute("style", "font-size: 150%; font-family: arial; color: teal")
16
17# Save the HTML document to a file
18output_dir = "output/"
19os.makedirs(output_dir, exist_ok=True)
20html_path = os.path.join(output_dir, "edit-inline-css.html")
21document.save(html_path)
22
23# Create an instance of the PDF output device and render the document to this device
24pdf_path = os.path.join(output_dir, "edit-inline-css.pdf")
25with rp.PdfDevice(pdf_path) as device:
26 document.render_to(device)
Dans cet exemple particulier, la couleur, la taille de la police et la famille de la police s’appliquent à l’élément <p>
. Le fragment de la page PDF rendue ressemble à ceci :
CSS interne
L’option de style CSS interne est populaire pour appliquer des propriétés à des pages individuelles en encapsulant tous les styles dans l’élément <style>
placé dans le <head>
des documents HTML.
1# Edit HTML with internal CSS using Python
2
3import os
4import aspose.html as ah
5import aspose.html.rendering.pdf as rp
6
7
8# Define the content of the HTML document
9content = "<div><h1>Internal CSS</h1><p>An internal CSS is used to define a style for a single HTML page</p></div>"
10
11# Create an instance of an HTML document with specified content
12document = ah.HTMLDocument(content, ".")
13
14# Create a <style> element and define internal CSS rules
15style = document.create_element("style")
16style.text_content = (
17 ".frame1 { margin-top:50px; margin-left:50px; padding:25px; width:360px; height:90px; "
18 "background-color:#82011a; font-family:arial; color:#fff5ee;} \r\n"
19 ".frame2 { margin-top:-70px; margin-left:160px; text-align:center; padding:20px; width:360px; "
20 "height:100px; background-color:#ebd2d7;}"
21)
22
23# Find the <head> element and append the style element
24head = document.get_elements_by_tag_name("head")[0]
25head.append_child(style)
26
27# Find the first paragraph element and apply styles
28header = document.get_elements_by_tag_name("h1")[0]
29header.class_name = "frame1"
30
31# Update the style using the style attribute directly
32header.set_attribute("style", "font-size: 200%; text-align: center;")
33
34# Find the last paragraph element and apply styles
35paragraph = document.get_elements_by_tag_name("p")[0]
36paragraph.class_name = "frame2"
37paragraph.set_attribute("style", "color: #434343; font-size: 150%; font-family: verdana;")
38
39# Save the HTML document to a file
40output_dir = "output/"
41os.makedirs(output_dir, exist_ok=True)
42html_path = os.path.join(output_dir, "edit-internal-css.html")
43document.save(html_path)
44
45# Create an instance of the PDF output device and render the document to this device
46pdf_path = os.path.join(output_dir, "edit-internal-css.pdf")
47with rp.PdfDevice(pdf_path) as device:
48 document.render_to(device)
Dans cet exemple, nous utilisons le CSS interne et déclarons également des propriétés de style supplémentaires pour des éléments individuels en utilisant l’attribut style
à l’intérieur des balises <h1>
et <p>
. La figure illustre le fragment du fichier rendu “edit-internal-css.pdf” :
Téléchargez la bibliothèque Aspose.HTML for Python via .NET pour manipuler avec succès, rapidement et facilement vos documents HTML. La bibliothèque Python peut créer, modifier, extraire des données, convertir et rendre des documents HTML sans nécessiter de logiciel externe. Elle prend en charge les formats de fichiers les plus courants tels que EPUB, MHTML, XML, SVG et Markdown et peut convertir les documents en formats PDF, DOCX, XPS et Image.