Hola chicos estoy realizando una aplicación en la que se requieren estos puntos, pero solo tengo hecho lo básico, y no se si es correcto, lo suyo sería utilizar ***array push*** para añadir datos y ***splice*** para eliminarlos mientras se escribe en el input, pero, ¿Cómo aplicarlo de manera correcta? ***P.D.:*** el formulario lo tengo hecho en ***DOM***, pero como son demasiados caracteres y no me deja pegarlo, lo he hecho en html. ***Gracias de antemano...*** Aquí los puntos necesarios para que sea correcto : **a)** Se escribe un ***mensaje de error*** la página (no un alert), si pulsan añadir y eliminar y no se han rellenado ambos campos. **b)** Si ***pulsan*** ***añadir*** se crea una nueva línea en el listado en forma de ***tabla***. **c)** Si ***pulsan*** ***añadir*** y la persona ya está en la tabla, escribimos un mensaje de error. **d)** Si ***pulsan*** ***eliminar***, eliminamos la persona de la tabla, o avisamos en caso de que no exista. **e)** Si ***pulsan*** ***eliminar*** y la persona no existe en la tabla, escribimos un mensaje de error. <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> function guardar() { var nombre = document.getElementById('nombre').value; var apellido = document.getElementById('apellido').value; var resultado = document.getElementById('resultado'); if (nombre.trim() == '') { resultado.innerHTML = 'No puedes dejar el nombre vacio'; nombre.focus(); //alert("ingrese el nombre"); } if (apellido.trim() == '') { resultado.innerHTML = 'No puedes dejar el apellido vacio'; apellido.focus(); } else { var fila = "<tr><td>" + nombre + "</td><td>" + apellido + "</td>" + "</td></tr>"; var btn = document.createElement("TR"); btn.innerHTML = fila; document.getElementById("tablita").appendChild(btn); } } <!-- language: lang-html --> <html lang="es"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Ejercicio-2</title> <link rel="stylesheet" href="style.css"> <script src="ejercicio2.js"></script> </head> <body> <div class="contenedor-principal" id="contenedor"> <form id="formulario" action=" "> <input type="text" name="nombre" placeholder="Nombre" id="nombre"> <input type="text" name="apellido" placeholder="apellido" id="apellido"> <button type="button" name="añadir" onclick="guardar()" id="Añadir">Añadir</button> <button type="button" name="eliminar" id="eliminar">Elminar</button> </form> <br> <table border="1"> <thead> <tr> <th>Nombre</th> <th>Apellido</th> </tr> </thead> <tbody id="tablita"> </tbody> </table> </div> </body> </html> <!-- end snippet -->