Propriedade outerHTML

A propriedade outerHTML permite obter e alterar o código HTML de um elemento junto com sua tag.

Sintaxe

javascriptelemento.outerHTML;

Exemplo

Vamos exibir o texto do elemento usando a propriedade outerHTML:

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

Resultado da execução do código:

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

Exemplo

Vamos transformar o parágrafo em um div com o mesmo texto:

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

Resultado da execução do código:

html<div>texto</div>

Veja também

  • propriedade textContent,
    que contém o texto do elemento
  • propriedade innerHTML,
    que contém o código HTML do elemento