forked from marquez.juan/clase-10-ejercicios-de-repaso
Solucion ejercicio 2
This commit is contained in:
@@ -1 +1,22 @@
|
||||
// Agregar aquí el código javascript
|
||||
const boton = document.querySelector("#agregar");
|
||||
|
||||
boton.addEventListener("click", () => {
|
||||
const campo = document.querySelector("#agregar input");
|
||||
const texto = campo.value.trim();
|
||||
|
||||
const lista = document.querySelector("#lista ul");
|
||||
|
||||
// Si el campo está vacío, no hacemos nada.
|
||||
if (texto === "") return;
|
||||
|
||||
// Creamos el nuevo ítem y lo agregamos a la lista.
|
||||
const item = document.createElement("li");
|
||||
item.textContent = texto;
|
||||
lista.appendChild(item);
|
||||
|
||||
// Limpiamos el campo para que el usuario pueda escribir la próxima tarea.
|
||||
campo.value = "";
|
||||
// Ponemos el cursor nuevamente en el campo:
|
||||
campo.focus();
|
||||
});
|
||||
|
||||
@@ -8,6 +8,16 @@
|
||||
</head>
|
||||
<body>
|
||||
<h1>Ejercicio 2</h1>
|
||||
<div id="lista">
|
||||
<h2>Lista de tareas</h2>
|
||||
<ul>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
<div id="agregar">
|
||||
<input type="text" placeholder="Descripción de la nueva tarea">
|
||||
<button type="button">Agregar tarea</button>
|
||||
</div>
|
||||
|
||||
<script src="ejercicio2.js"></script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user