72 lines
2.1 KiB
JavaScript
72 lines
2.1 KiB
JavaScript
// Agregar acá el código javascript para los ejercicios
|
|
const boton1 = document.querySelector("button");
|
|
const parrafo1 = document.querySelector("p");
|
|
var i = 0
|
|
|
|
boton1.addEventListener("click", function () {
|
|
i = i + 1
|
|
parrafo1.textContent = `Este boton ha sido clickeado ${i} veces.`;
|
|
});
|
|
|
|
const campo = document.querySelector("input");
|
|
const parrafo2 = document.querySelector("#contadorCaracteres");
|
|
|
|
campo.addEventListener("input", (e) => {
|
|
parrafo2.textContent = `El campo de texto tiene ${e.target.value.length} caracteres.`;
|
|
});
|
|
|
|
const lista = document.querySelector("ul");
|
|
|
|
lista.addEventListener("click", (e) => {
|
|
if (e.target.tagName === "LI") {
|
|
const items = document.querySelectorAll("li")
|
|
for (const item of items) {
|
|
item.classList.remove("seleccionado");
|
|
}
|
|
|
|
e.target.classList.add("seleccionado");
|
|
|
|
console.log(e.target.textContent);
|
|
}
|
|
});
|
|
|
|
document.querySelector("#externo").addEventListener("click", () => {
|
|
console.log("externo");
|
|
}, true);
|
|
document.querySelector("#interno").addEventListener("click", () => {
|
|
console.log("interno");
|
|
});
|
|
document.querySelector("#boton").addEventListener("click", () => {
|
|
console.log("boton");
|
|
});
|
|
|
|
formulario.addEventListener("submit", function(e) {
|
|
e.preventDefault();
|
|
|
|
const nombre = document.querySelector("#nombre");
|
|
const mensaje = document.querySelector("#mensaje");
|
|
const errorNombre = document.querySelector("#errorNombre");
|
|
const errorMensaje = document.querySelector("#errorMensaje");
|
|
const resultado = document.querySelector("#resultado");
|
|
|
|
errorNombre.textContent = "";
|
|
errorMensaje.textContent = "";
|
|
resultado.textContent = "";
|
|
|
|
let hayErrores = false;
|
|
|
|
if (nombre.value.trim() === "") {
|
|
errorNombre.textContent = "El nombre no puede estar vacío";
|
|
hayErrores = true;
|
|
}
|
|
|
|
if (mensaje.value.trim() === "") {
|
|
errorMensaje.textContent = "El mensaje no puede estar vacío";
|
|
hayErrores = true;
|
|
}
|
|
|
|
if (!hayErrores) {
|
|
resultado.textContent = "Formulario enviado correctamente";
|
|
formulario.reset();
|
|
}
|
|
}); |