Javascript - Javascript interno

JavaScript interno

1. Antes de tudo, faça uma cópia local do nosso arquivo de exemplo aplicando-javascript.html. Salve-o em alguma pasta, de uma forma sensata.
2. Abra o arquivo no seu navegador web e no seu editor de texto. Você verá que o HTML cria uma simples página web contendo um botão clicável.
3. Agora, vá até o seu editor de texto e adicione o código a seguir antes da tag de fechamento </body>:

   <script>
   
     // O JavaScript fica aqui
   
   </script>

4. Agora nós vamos adicionar um pouco de JavaScript dentro do nosso elemento <script> para que a página faça algo mais interessante — adicione o seguinte código abaixo da linha "// O JavaScript fica aqui":

   function criarParagrafo() {
     let para = document.createElement('p');
     para.textContent = 'Você clicou no botão!';
     document.body.appendChild(para);
   }
   
   const botoes = document.querySelectorAll('button');
   
   for(var i = 0; i < botoes.length ; i++) {
     botoes[i].addEventListener('click', criarParagrafo);
   }

5. Salve seu arquivo e recarregue a página — agora você deveria ver que quando você clique no botão, um novo parágrafo é gerado e colocado logo abaixo.