ejercicio2

2026-05-27 01:08:20 -03:00
parent 80f5ca683e
commit 7775d18ff8
2 changed files with 27 additions and 1 deletions
--- a/ejercicio2/ejercicio2.js
+++ b/ejercicio2/ejercicio2.js
@@ -1 +1,21 @@
 // Agregar aquí el código javascript
+
+// Crear una página con un campo de texto y un botón "Agregar". Cada vez que se
+// haga clic en el botón, agregar el texto del campo como un nuevo ítem en una
+// lista `<ul>`. Después de agregar el ítem, limpiar el campo.
+
+// Si el campo está vacío al hacer clic, no agregar nada.
+
+let input = document.querySelector("input") //almacenamos en variables el boton, el input y la lista
+let boton = document.querySelector("button");
+let lista = document.querySelector("ul")
+
+boton.addEventListener("click", ()=>{ // creamos el listener "click" con la funcion
+    if (!(input.value.trim() === "")){ // si el input NO ESTÁ vacio, continuamos : 
+        nuevoLi = document.createElement("li"); //creamos el li ,
+        nuevoLi.textContent = input.value.trim(); // le damos contenido ,
+        lista.appendChild(nuevoLi); // lo anexamos a la lista ,
+        input.value = ""; // y vaciamos el input :)
+    }
+})
+ // fin
--- a/ejercicio2/index.html
+++ b/ejercicio2/index.html
@@ -8,7 +8,13 @@
    </head>
    <body>
        <h1>Ejercicio 2</h1>
-
+        <p>escriba un texto para agregar a la lista</p>
+        <br>
+        <input type="text" name="input" id="input">
+        <button id="boton-agregar">Agregar</button> 
+        <br>
+        <ul>
+        </ul>
        <script src="ejercicio2.js"></script>
    </body>
 </html>