Importação JavaScript

Olá! Creio que o que esteja acontecendo é que na sua tag <script> tem referência à js/principal.js, porém, pelo que é possível ver no vscode o arquivo principal.js não está na pasta js, o que faz com o que HTML não encontre a pasta.

Para resolver tem duas formas:

• Crie a pasta js e insira o arquivo principal.js dentro da pasta

ou

• altere o src da tag <script>, por exemplo: <script src="principal.js"></script>

Bom dia Matheus.

Tudo bem com você?

Acabei de excluir o arquivo, criei novamente a pasta, e refiz o código, não solucionou o problema, alterei o src da tag e infelizmente o problema persiste...

Ah, eu falei duas formas e você acabou misturando as duas, acontece kkkkk.

No <script> você tem que colocar o caminho pro arquivo princpal.js. Como agora você criou a pasta js, se escrever como estava antes, <script src="js/principal.js">, já resolve.

Bom dia Mateus.

Meu caro, desculpe minha falta de conhecimento, mas infelizmente ainda não consegui, vou te enviar um print do console, quem sabe facilita.

Bom dia Luciano.

Ok! Primeira parte resolvida, só esse erro do console já pelo menos diz que o problema inicial (ligar HTML e JavaScript) já foi resolvido.

O erro do console agora é que o document.querySelector() não conseguiu achar a classe .titulo. Confira no HTML se a classe está escrita de forma correta.

Um detalhe que pode te confundir é que o método querySelector() pode buscar por tudo no HTML, seja a tag, classe, id ou data-attribute. Por isso, quando no querySelector, se quisermos achar uma classe, escrevemos .nome-da-classe, mas no HTML estará sem o ., apenas <h1 class="nome-da-classe"></h1>

Alguns exemplos:

• Selecionando por tag: <h1></h1> - document.querySelector("h1")
• Selecionando por id: <h1 id="titulo"></h1> - document.querySelector("#titulo")
• Selecionando por classe: <h1 class="titulo"></h1> - document.querySelector(".titulo")
• Selecionando por data-attribute: <h1 data-titulo></h1> - document.querySelector("[data-titulo]")

Espero que tenha ajudado :)