Dia 33

2024-01-23 13:52:08 +01:00
parent ad40171fb4
commit b83034e0ab
12 changed files with 408 additions and 0 deletions
--- a/4/ejercicio04_DOM.html
+++ b/4/ejercicio04_DOM.html
@@ -0,0 +1,49 @@
+<!Doctype html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<title>Lista de la compra JAVASCRIPT</title>
+		
+		<script>
+			
+			function eliminar(elemento) {
+				// Utilizar remove
+				elemento.remove();
+			}
+			
+			function anadir() {
+				let listaCompra = document.getElementById("listaCompra");
+				let nuevoItem = document.getElementById("anadir").value;
+				
+				if (nuevoItem === "") {
+					alert("No has añadido nada");
+					} else {
+					let item = document.createElement("li");
+					item.textContent = nuevoItem;
+					item.addEventListener("dblclick", function() {
+						eliminar(item);
+					});
+					listaCompra.appendChild(item);
+					document.getElementById("anadir").value = "";
+				}
+			}	
+		</script>
+		
+	</head>
+	<body>
+		<div id="container">
+			
+            <label>Mi lista de la compra:</label>
+            <input type="text" name="campo" id="anadir">
+            <input type="button" value="Añadir a la lista" onclick="anadir()">
+			
+			<ul id="listaCompra"></ul>
+			
+			<p>Nota: Puedes eliminar elementos de la lista haciendo doble click sobre ellos</p>
+		</div>
+		
+		
+		<br>
+		
+	</body>
+</html>