dalessandro.bruno/clase-9-eventos
1
0
Fork 0
forked from marquez.juan/clase-9-eventos
Code Pull Requests Activity

Compare commits

base: dalessandro.bruno:ddefc238dc567d23af1f8bcff9e78fefcc2e63c7
Branches Tags
dalessandro.bruno:main dalessandro.bruno:ejercicios-eventos marquez.juan:main
...
compare: dalessandro.bruno:c95ca3ed74de6d0594d6592e9dbbbb600379d21b
Branches Tags
dalessandro.bruno:ejercicios-eventos dalessandro.bruno:main marquez.juan:main

2 Commits
ddefc238dc ... c95ca3ed74

Author SHA1 Message Date
Bruno Dalessandro
c95ca3ed74 Ejercicio 2 2026-05-23 22:07:36 -03:00
Bruno Dalessandro
3ccdaea6e9 Ejercicio 1 2026-05-23 21:58:20 -03:00
2 changed files with 55 additions and 2 deletions
Expand all files Collapse all files

47
clase-9.js
View File

@@ -1 +1,48 @@
// Agregar acá el código javascript para los ejercicios // Agregar acá el código javascript para los ejercicios
/*
1. Agregar a la página un botón y un párrafo que diga `Botón clickeado 0
veces`. Cada vez que se haga clic en el botón, el texto del párrafo debe
cambiar al mensaje `"Botón clickeado N veces"`, donde N es el número de
veces que se hizo clic.
*/
const boton = document.getElementById("boton");
boton.addEventListener("click", () => {
let contador = parseInt(document.getElementById("cantidad").textContent);
contador = contador + 1;
document.getElementById("cantidad").textContent = contador;
if (contador === 1) {
document.getElementById("descripcionCantidad").textContent = "vez.";
} else {
document.getElementById("descripcionCantidad").textContent = "veces.";
}
})
/*
2. Agregar un campo de texto a la página. A medida que el usuario escribe,
mostrar en tiempo real la cantidad de caracteres ingresados debajo del campo.
*/
const inputTexto = document.getElementById("texto");
inputTexto.addEventListener("input", () => {
let cantidad = inputTexto.value.length;
document.getElementById("cantidadCaracteres").textContent = cantidad;
})

10
index.html
View File

@@ -9,11 +9,17 @@
<body> <body>
<h1>Clase 9 - Eventos</h1> <h1>Clase 9 - Eventos</h1>
<div id="ejercicio-1"> <div id="ejercicio-1">
<!-- Agregar acá el código HTML que haga falta para el ejercicio 1 --> <p>Boton clickeado <span id="cantidad">0</span> <span id="descripcionCantidad">veces.</span></p>
<button id="boton">Haz click aqui</button>
</div> </div>
<hr> <hr>
<div id="ejercicio-2"> <div id="ejercicio-2">
<!-- Agregar acá el código HTML que haga falta para el ejercicio 2 --> <input type="text" id="texto">
<p>
Cantidad de caracteres:
<span id="cantidadCaracteres">0</span>
</p>
</div> </div>
<hr> <hr>
<div id="ejercicio-3"> <div id="ejercicio-3">