Aktualizujte označení HTML prvku DOM pomocí JavaScriptu

V JavaScriptu je prvek HTML innerHTML vlastnost lze použít k nastavení nebo získání značky HTML v prvku. Tato vlastnost vrací řetězec DOM obsahující serializaci HTML všech podřízených prvků.

Pokud nastavíte novou hodnotu innerHTML , odstraní všechny podřízené uzly prvku a nahradí je uzly HTML vytvořenými analýzou řetězce HTML.

Řekněme, že máme následující <div> prvek někde v dokumentu:

<div id="hint">
    <p>Learn JavaScript for free!</p>
</div>

Chcete-li získat aktuální označení HTML z výše uvedeného HTML použijte následující JavaScript:

// grab element
const div = document.querySelector('#hint');

// get current HTML markup
console.log(div.innerHTML);

// <p>Learn JavaScript for free!</p>

Chcete-li nahradit stávající označení HTML úplně, jednoduše nastavte novou hodnotu innerHTML jako níže:

// replace existing markup
div.innerHTML = 'span>Hey, there!</span>';

Chcete-li předtím přidat nové prvky aktuální označení HTML, proveďte následující:

div.innerHTML = 'span>Hey, there!</span>' + div.innerHTML;

Chcete-li přidat obsah HTML za existující označení:

div.innerHTML += 'span>Hey, there!</span>';

Nové označení může být libovolné platné Řetězec HTML, včetně jednoduchého prostého textu:

div.innerHTML = 'This is plain text';

Další informace: Jak vytvořit prvek DOM pomocí JavaScript