Как работат метод innerhtml в js?

.innerHTML позволяет читать и изменять содержимое HTML-элемента. При записи старое содержимое заменяется новым. Перед этим новое значение будет разобрано как HTML, и если обнаружатся ошибки, метод выбросит исключение.

<div class="example">
   <a href="#" class="example_link" >link</a>
   <p class="example_text">Text</p>
 </div>

const example = document.querySelector('.example');
console.log(example.innerHTML);  
// => '<a href="#" class="example_link">link</a><p class="expample_text">Text</p>'

const example = document.querySelector('.example');
example.innerHTML = '<b>new text</b>';
console.log(example.innerHTML);
// => '<b>new text</b>'

Манипулирование DOM-деревом