forked from marquez.juan/clase-9-eventos
Compare commits
4 Commits
main
...
arteche-ma
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
a91f71ea38 | ||
|
|
bf13149adc | ||
|
|
c02c102b27 | ||
|
|
3ff19d590b |
30
clase-9.js
30
clase-9.js
@@ -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
14
index.html
@@ -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">
|
||||
|
||||
Reference in New Issue
Block a user