Explicación detallada del script de envío de correo (JavaScript)
const form = document.getElementById("formContacto");
• const → crea una variable constante (no cambia su valor después).
• form → es el nombre de la variable.
• document → representa toda la página web.
• getElementById("formContacto") → busca el elemento del HTML con ese id.
⇒ En resumen: guarda dentro de form el formulario del HTML.
------------------------------------------------------------
const errorCorreo = document.getElementById("errorCorreo");
• Crea otra variable llamada errorCorreo.
• Busca el elemento donde se mostrará el mensaje de error.
------------------------------------------------------------
form.addEventListener("submit", (e) => {
• addEventListener → escucha un evento (acción del usuario).
• "submit" → el evento ocurre al intentar enviar el formulario.
• (e) => { } → función que se ejecuta cuando pasa ese evento.
------------------------------------------------------------
e.preventDefault();
• Evita que el formulario recargue la página automáticamente.
------------------------------------------------------------
const nombre = document.getElementById("nombre").value.trim();
const correo = document.getElementById("correo").value.trim();
const motivo = document.getElementById("motivo").value;
const mensaje = document.getElementById("mensaje").value.trim();
• .value → obtiene el texto o selección del usuario.
• .trim() → quita espacios vacíos antes o después del texto.
------------------------------------------------------------
const regexCorreo = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
• Es una expresión regular (regex) que verifica que el texto tenga formato de correo.
------------------------------------------------------------
if (!regexCorreo.test(correo)) {
errorCorreo.textContent = "Por favor, ingresa un correo válido.";
return;
} else {
errorCorreo.textContent = "";
}
• Si el correo no cumple la forma correcta, muestra el error y detiene el proceso.
------------------------------------------------------------
const asunto = encodeURIComponent(`Consulta sobre: ${motivo}`);
• encodeURIComponent → convierte el texto a un formato que se puede poner en una URL.
------------------------------------------------------------
const cuerpo = encodeURIComponent(
`Nombre: ${nombre}\nCorreo: ${correo}\nMotivo: ${motivo}\n\nMensaje:\n${mensaje}`
);
• Arma el cuerpo del mensaje. \n crea saltos de línea.
------------------------------------------------------------
window.open(`https://mail.google.com/mail/?
view=cm&fs=1&[email protected]&su=${asunto}&body=${cuerpo}`,
"_blank");
• window.open() → abre una nueva pestaña.
• Gmail se abre con todo listo (destinatario, asunto, mensaje).
------------------------------------------------------------
Resumen:
1. Captura los datos del usuario.
2. Verifica que el correo tenga formato correcto.
3. Si no, muestra un mensaje de error.
4. Si sí, abre Gmail con el mensaje preparado.