Pour ce premier exemple, nous allons ajouter de nouveaux éléments HTML dans une page web, avec leur contenu textuel. Nous allons utiliser la méthode createElement(), qui permet de créer un nouvel élément HTML, et la méthode appendChild(), qui permet d’ajouter un nœud enfant à un nœud spécifié. Voici les pages consacrées à ces deux méthodes : https://developer.mozilla.org/fr/docs/Web/API/Document/createElement et https://developer.mozilla.org/fr/docs/Web/API/Node/appendChild
Voici la structure HTML initiale :
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Mon script</title> </head> <body> <div id="destinations"> </div> </body> </html>
Nous avons une boîte <div> qui possède un identifiant, id="destinations", et qui est vide de tout contenu.
Voici le script inséré dans le fichier HTML, juste avant la balise </body> :
<script> // Création des deux nouveaux éléments var nouvelEnTeteH2 = document.createElement(’h2’) ; ...
Abonnement
tous les livres et vidéos ENI en illimité sans engagement
du livre imprimé ou du livre numérique