Solucionado
eu percebi que esse jeito de fazer uma função para as tags no HTML nao funciona com mais de 1 tag do mesmo tipo. exemplo coloquei outro H1 no HTML e ele não renomeou automaticamente, como faríamos pra fazer isso se tivesse mais de 1 tag do mesmo tipo?
Oi, Leanderson! Tudo bem?
O método querySelector é uma função em JavaScript que é usada para selecionar o primeiro elemento HTML que corresponde a um seletor CSS especificado. Dessa forma, quando usamos o document.querySelector('h1'), por exemplo, estamos selecionando apenas o primeiro elemento <h1> que existir na página.
Uma maneira de selecionarmos todos os elementos desejados, é criando um seletor CSS específico para cada um deles e os chamando através do método querySelector no nosso JavaScript, deixando o trecho do nosso html, da seguinte forma, por exemplo:
<h1 id="titulo1">Primeiro Título</h1>
<h1 id="titulo2">Segundo Título</h1>
E o nosso JavaScript da seguinte maneira:
let titulo1 = document.querySelector('#titulo1');
let titulo2 = document.querySelector('#titulo2');
Porém, existem diversos outros métodos seletores que podemos explorar para resolver o problema, como o getElementById ou até mesmo o querySelectorAll. Dessa forma, deixo como sugestão de estudo e leitura o seguinte artigo:
Espero ter ajudado! Caso tenha ficado alguma dúvida, sinta-se à vontade em comunicar, estou à disposição!
Um forte abraço e bons estudos!
obrigado pela resposta ajudou muito, de verdade.