Modification du contenu HTML de -

Modification de contenu HTML

La meilleure façon de modifier le contenu d'un élément HTML est en utilisant le innerHTML propriété.

Pour modifier le contenu d'un élément HTML, utilisez la syntaxe suivante:

document.getElementById(id).innerHTML = new HTML

Cet exemple modifie le contenu d'un élément <h>:

<h1 id="id01">Ancienne rubrique</h1>
<script>
var element = document.getElementById("id01");
element.innerHTML = "Nouvelle rubrique";
</script>
</body></html>

Exemple

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript peut changer le HTML</h2>

<h1 id="id01">Ancienne rubrique</h1>

<p>JavaScript change Une ancienne rubrique en nouvelle rubrique".</p>

<button onclick="changeh()"><span style="background-color: #000000; color: #ffffff;">Changez le contenu de h ici</span></button>

<span style="background-color: #FF0000; color: #ffffff;"></span>
function changeh() {
var element = document.getElementById("id01");
element.innerHTML = "Nouvelle rubrique";
}
</script>

<button onclick="recharge()"><span style="background-color: #FF0000; color: #ffffff;">Rechargez la page</span></button>

</body>
</html>

Le document HTML ci-dessus contient un élément <h> avec id = "id01"
Nous utilisons les DOM HTML pour obtenir l'élément avec id = « id01 »
Un JavaScript modifie le contenu (innerHTML) de cet élément en « Nouvelle rubrique »

Résultat de l'exemple

JavaScript peut changer le HTML

Ancienne rubrique

JavaScript change Une ancienne rubrique en nouvelle rubrique".