Estava estudando JS na faculdade pois era a primeira cadeira. Consegui uma boa nota na prova final e muita coisa foi graças ao Alura com certeza. Mas estou com uma dificuldade boba, minha atividade de portfólio é validar um formulario que só tem o campo Email e a missão é fazer com que se o usuario não escreva nada na area de texto apareça uma mensagem de erro. Mas mesmo assim não estou conseguindo realizar essa atividade simples, já alterei o codigo diversas vezes, em alguns momentos a mensagem sempre aparecia, em outros a mensagem nem aparecia, usei o console.log pra saber se estava no elemento certo, fiz de tudo que sabia fazer. Meu ultimo recurso são fóruns por favor me ajudem, o codigo até então esta assim: index:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
<title>Contato</title>
</head>
<body>
<form id="formulario">
<h3 id="erro"></h3>
<label for="email">Email *</label>
<input type="email" id="email" class="campo" placeholder="exemplo@gmail.com">
<button id="botao">Evniar</button>
</form>
<script src="JS/principal.js"></script>
</body>
</html>
e o js esta em uma pasta e esta assim:
const nome = document.getElementById("email")
const from = document.querySelector("form")
const erro = document.getElementById("erro")
function validarEmail() {
if (nome.value.length == 0) {
erro.textContent = "Você não preencheu o campo Email";
} else {
erro.textContent = "";
}
}
from.addEventListener("submit", (event)=> {
validarEmail();
if (nome.value.length == 0) {
event.preventDefault();
}
});
Por favor, não tenho mais recursos, já revi meu material didático da faculdade e mesmo assim não consigo progredir, alguém pode me dar um norte? ou até mesmo uma solução? Me frustei tanto que cheguei a cair em choro. Do modo que esta nem a mensagem de erro aparece... quando eu não uso o formulario inteiro e seleciono só o campo, a mensagem de erro fica o tempo todo na tela, mesmo se o usuário preencher. tambem já usei o evento de click, já fiz muitas coisas nesse codigo realmente era pra ser simples... mas n consigo o resultado