arteche.mateo/clase-9-eventoskkkkk
1
0
Fork 0
forked from marquez.juan/clase-9-eventos
Code Pull Requests Activity

Compare commits

base: arteche.mateo:main
Branches Tags
arteche.mateo:main arteche.mateo:arteche-mateo-rama marquez.juan:main
..
compare: arteche.mateo:arteche-mateo-rama
Branches Tags
arteche.mateo:arteche-mateo-rama arteche.mateo:main marquez.juan:main

4 Commits
main ... arteche-ma

Author SHA1 Message Date
DevMate-Jar
a91f71ea38 Add exercise 1, 2, 3 2026-06-01 21:23:17 -03:00
DevMate-Jar
bf13149adc Finish exercise 3 2026-06-01 21:18:12 -03:00
DevMate-Jar
c02c102b27 Finish exercise 2 2026-06-01 20:41:42 -03:00
DevMate-Jar
3ff19d590b Finish exercise 1 2026-06-01 20:27:16 -03:00
2 changed files with 40 additions and 4 deletions
Expand all files Collapse all files

30
clase-9.js
View File

@@ -1 +1,29 @@
// Agregar acá el código javascript para los ejercicios
const botonf = document.getElementById("boton1");
const parrafob = document.getElementById("parrafo1");
let contador = 0;
botonf.addEventListener("click", () => {
contador++;
parrafob.textContent = "Boton clickeado " + contador + " veces";
}) // Ejercicio 1
const textoCaracter = document.getElementById("text");
const parrafoCaracter = document.getElementById("carac0");
textoCaracter.addEventListener("input", () => {
parrafoCaracter.textContent = "Cantidad de caracteres: " + textoCaracter.value.length
}) // Ejercicio 2
const listaEvent = document.getElementById("itemListas");
listaEvent.addEventListener("click",(e) => {
if (e.target.tagName == "LI") {
console.log(e.target.textContent);
}
})

14
index.html
View File

@@ -9,15 +9,23 @@
<body>
<h1>Clase 9 - Eventos</h1>
<div id="ejercicio-1">
<!-- Agregar acá el código HTML que haga falta para el ejercicio 1 -->
<button id="boton1">Boton</button>
<p id="parrafo1">Boton clickeado 0 veces</p>
</div>
<hr>
<div id="ejercicio-2">
<!-- Agregar acá el código HTML que haga falta para el ejercicio 2 -->
<input type="texto" id="text">
<p id="carac0">Cantidad de caracteres: 0</p>
</div>
<hr>
<div id="ejercicio-3">
<!-- Agregar acá el código HTML que haga falta para el ejercicio 3 -->
<ul id="itemListas">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ul>
</div>
<hr>
<div id="ejercicio-4">