[Dúvida] não entendi muito bem como o innerHTML funciona.

innerHTML serve para pegar o conteúdo de dentro de uma tag html. Ele é muito usado para manipulação de DOM. Por exemplo, tenho um arquivo index.html com a seguinte estrutura:

<div id="test">
    <p>Hello World</p>
</div>

Usando document.getElementById('test'), o meu resultado vai ser um object com as estruturas do HTML interno. Caso eu queira adicionar algo, basta eu usar o seguinte:

let test = document.getElementById('test')
test.innerHTML += "<p>Ola Mundo</p>"

test.innerHTML vai ser uma string, eu posso adicionar qualquer coisa usando concatenação.

Resumindo tudo: sim ele converte os elementos do seu HTML para estruturas em JS para que você possa manipular o DOM.