Estou tentando implementar o que está sendo ensinado nesse artigo da formação front-end mas não sei exatamente onde eu coloco o código que está sendo ensinado no passo a passo. Alguém poderia dar uma luz? Obrigado
Estou tentando implementar o que está sendo ensinado nesse artigo da formação front-end mas não sei exatamente onde eu coloco o código que está sendo ensinado no passo a passo. Alguém poderia dar uma luz? Obrigado
Oi Rafael!
Os arquivos inicias so projeto estão neste link e os arquivos CSS estão aqui. Depois de baixar os dois arquivos e extraí-los, copie e cole os arquivos CSS na pasta asserts\stylesheets\stilize.
Você pode colocar o código javascript ensinado no post dentro de uma tag script no final do body no arquivo HTML, desta maneira:
<body>
// código inicial da aula
<script>
// código ensinado aqui
</script>
</body>Após ler o artigo, percebi que são necessários 2 passos adicionais para que o código funcione corretamente:
buscaCepdocument.querySelector('.o-button--gary').addEventListener('click', buscaCep);type="button" no botão que com o ícone de globo// linha 19 do index.html
<button class="o-button--gary" type="button"><i class="icon-globe"></i></button>Como o botão está dentro de um form, seu type padrão é submit e isso causaria um refresh na página ao ser clicado. Desta forma os campos seriam preenchidos com os dados, mas logo em seguida a página seria recarregada, limpando todos os campos. Sendo assim, a troca para type="button" impede esse comportamento indesejado.Espero ter ajudado! Se tiver mais alguma dúvida pode postar aqui! :)