Propriété outerHTML

La propriété outerHTML permet d'obtenir et de modifier le code HTML d'un élément avec sa balise.

Syntaxe

javascriptélément.outerHTML;

Exemple

Affichons le texte de l'élément en utilisant la propriété outerHTML :

html<p id="elem">text</p>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.outerHTML);

Résultat de l'exécution du code :

javascript'<p id="elem">text</p>'

Exemple

Remplaçons le paragraphe par une div avec le même texte :

html<p id="elem">text</p>
javascriptlet elem = document.querySelector('#elem');
elem.outerHTML = '<div>' + elem.innerHTML + '</div>';

Résultat de l'exécution du code :

html<div>text</div>

Voir aussi

  • la propriété textContent,
    qui contient le texte de l'élément
  • la propriété innerHTML,
    qui contient le code HTML de l'élément