Saltar al contenido

Cómo convertir una lista de nodos DOM en un array en Javascript?

Este team de especialistas pasados muchos días de trabajo y de recopilar de información, han obtenido la respuesta, queremos que resulte útil para ti para tu plan.

Solución:

En es6 puedes usar de la siguiente manera:

  • Operador de propagación

     var elements = [... nodelist]
    
  • Utilizando Array.from

     var elements = Array.from(nodelist)
    

más referencia en https://developer.mozilla.org/en-US/docs/Web/API/NodeList

Las listas de nodos son objetos anfitrionesutilizando el Array.prototype.slice No se garantiza que el método en los objetos host funcione, la especificación ECMAScript establece:

Depende de la implementación si la función de división se puede aplicar con éxito a un objeto host.

Te recomendaría hacer una función simple para iterar sobre el NodeList y agregue cada elemento existente a un array:

function toArray(obj) 
  var array = [];
  // iterate backwards ensuring that length is an UInt32
  for (var i = obj.length >>> 0; i--;)  
    array[i] = obj[i];
  
  return array;

ACTUALIZAR:

Como sugieren otras respuestas, ahora puede usar en entornos modernos la sintaxis extendida o la Array.from método:

const array = [ ...nodeList ] // or Array.from(nodeList)

Pero pensándolo bien, supongo que el caso de uso más común para convertir un NodeList en un Array es iterarlo, y ahora el NodeList.prototype objeto tiene el forEach método de forma nativa, por lo que si se encuentra en un entorno moderno, puede usarlo directamente o tener un pollyfill.

Usando spread (ES2015), es tan fácil como: [...document.querySelectorAll('p')]

(opcional: use Babel para transpilar el código ES6 anterior a la sintaxis ES5)


Pruébelo en la consola de su navegador y vea la magia:

for( links of [...document.links] )
  console.log(links);

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *