Ejercicio 2

clase-9.js

@@ -1,5 +1,6 @@
 // Agregar acá el código javascript para los ejercicios
 
+//EJERCICIO 1
 // 1. Inicialización del estado
 let contador = 0;
 
@@ -14,3 +15,18 @@ boton.addEventListener('click', function () {
     // Actualizo el contenido de texto del párrafo
     parrafo.textContent = `Botón clickeado ${contador} veces.`;
 });
+
+//EJERCICIO 2
+// 1. Selección de los elementos del DOM
+const campo = document.querySelector("#campo-texto");
+const contadorcaracteres = document.querySelector("#contador-caracteres");
+
+// 2. Registro del Event Listener utilizando una función clásica
+campo.addEventListener("input", function (e) {
+    // Obtengo el texto actual del campo
+    const textoActual = e.target.value;
+    // Calculo la longitud del texto
+    const cantidadCaracteres = textoActual.length;
+    // Actualizo el contenido del párrafo
+    contadorcaracteres.textContent = `Caracteres ingresados: ${cantidadCaracteres}`;
+});

index.html

@@ -16,8 +16,8 @@
         <hr>
         <div id="ejercicio-2">
             <!-- Agregar acá el código HTML que haga falta para el ejercicio 2 -->
-            
+            <input type="text" id="campo-texto" placeholder="Escribe algo aquí...">
-            
+            <p id="contador-caracteres">Caracteres ingresados: 0</p> 
         </div>
         <hr>
         <div id="ejercicio-3">