innerHTML

Leçon 11 sur 13 du cours Méthodes DOM en JavaScript de Coddy.

La propriété innerHTML définit ou récupère le contenu HTML complet (y compris les éléments enfants) à l'intérieur d'un élément. Ceci est utile pour mettre à jour dynamiquement le contenu d'une section de page web.

element.innerHTML = "<b>Example Text !!</b>";

Défi

Facile

On vous donne un code HTML qui contient un div avec un ID content .

En utilisant uniquement JavaScript, modifiez le contenu de cet élément div :

Récupérez l'élément div en utilisant la fonction getElementById .
Définissez le contenu HTML sur "<b>Updated Content</b>".

Essayez vous-même

<!DOCTYPE html>
<html>
    <body>
        <div id="content">Original Content</div>
        <script src="script.js"></script>
    </body>
</html>

Toutes les leçons de Méthodes DOM en JavaScript

1Introduction

Introduction Document Object Model

2Méthodes du DOM I

getElementById Modifier le style d'un élément getElementsByClassName Parcourir et manipuler getElementsByTagName querySelector

3Méthodes du DOM II

querySelectorAll addEventListenerinnerHTMLcreateElement et appendChild classList toggle

Entraînez-vous par vous-même : Playground Web