1

He eliminado nodos uno por uno pero quisiera saber cómo eliminar más de un nodo. Hasta ahora mi código ha sido el siguiente, en el cual por prompt ingreso un número, el cual es la posición del nodo que quiero eliminar. El código funciona pero no es eficiente si tuviera muchos nodos. ¿Alguna idea?

 <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <title>Document Model</title>
    </head>
    
    <body>
    
        <ol id="lista">
            <li id="uno">Texto de ejemplo 1</li>
            <li id="dos">Texto de ejemplo 2</li>
            <li id="tres">Texto de ejemplo 3</li>
        </ol>
    
    
        <script>
    
            var elemento = document.createElement("li"),
                contenido = document.createTextNode("Este elemento reemplazo a texto de ejemplo 1");
            elemento.appendChild(contenido);
            var padre = document.getElementsByTagName("li")[0].parentNode;
    
            /* <b>AHORA ELIMINAR NODO DE UNA LISTA </b>  */

//    Aqui lo hago mediante ingreso por teclado
    
            var posicion = document.getElementsByTagName("li")[0];
            var posicion1 = document.getElementsByTagName("li")[1];
            var posicion2 = document.getElementsByTagName("li")[2];
    
            var recibe = prompt("Ingrese nodo a eliminar");
            if (recibe == 0) {
    
                padre.removeChild(posicion);
            } else if (recibe == 1) {
                padre.removeChild(posicion1);
            } else {
                padre.removeChild(posicion2);
            }
    
    
        </script>
    
    </body>
    
    </html>

1 respuesta 1

1

Prueba con algo así:

var padre = document.getElementsByTagName("li")[0].parentNode;
var recibe = prompt("Ingrese nodos a eliminar (separados con espacio)")
recibe.split(" ").sort((a,b)=>b-a).forEach(element => padre.removeChild(document.getElementsByTagName("li")[element]));

Explicación

Lo que hacemos es dividir el string recibido en el prompt mediante el método split(), convirtiéndolo de este modo en un array que luego reordenamos de forma inversa usando el método sort() para que, durante la eliminación de los elementos siguiente se haga de mayor a menor número de índice (de este modo no perdemos la referencia de los índices a eliminar después de cada eliminación individual, porque son recalculados cada vez que borramos uno).

Después recorremos ese array ordenado de forma descencente usando el método forEach() y en cada ciclo vamos suprimiendo cada nodo con el método removeChild() y usando la variable element del forEach como número de índice.

Aquí te dejo un ejemplo funcional completo:

var padre = document.getElementsByTagName("li")[0].parentNode;
var recibe = prompt("Ingrese nodos a eliminar (separados con espacio)")
recibe.split(" ").sort((a,b)=>b-a).forEach(element => padre.removeChild(document.getElementsByTagName("li")[element]));
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <title>Document Model</title>
  </head>

  <body>
    <ol id="lista">
      <li id="uno">Texto de ejemplo 1</li>
      <li id="dos">Texto de ejemplo 2</li>
      <li id="tres">Texto de ejemplo 3</li>
    </ol>
  </body>

</html>

2
  • Si me sirvio muchas gracias, sinceramente estaba rindiendome con el prompt y empece a hacerlo un poco mas dinamico implementando una entrada y un boton, pero cuentame, lo hiciste en una linea de codigo, espero el detalle de tu solucion
    – TONY STARK
    el 26 jul. 2022 a las 5:22
  • @TONYSTARK ya he completado la explicación. Si esta respuesta ha resuelto tu pregunta deberías aceptarla para que no quede pendiente eternamente y la comunidad lo sepa. En este enlace aprenderás a aceptar respuestas y el porque es importante hacerlo.
    – masterguru
    el 26 jul. 2022 a las 7:27

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.