Saltar al contenido

Cómo recorrer los elementos seleccionados con document.querySelectorAll

Esta noticia ha sido aprobado por nuestros especialistas así garantizamos la exactitud de nuestro post.

Solución:

for in loop no se recomienda para arreglos y array-como objetos – ya ves por qué. Puede haber algo más que elementos indexados por números, por ejemplo, el length propiedad o algunos métodos, pero for in recorrerá todos ellos. Utilizar cualquiera

for (var i = 0, len = checkboxes.length; i < len; i++) 
    //work with checkboxes[i]

o

for (var i = 0, element; element = checkboxes[i]; i++) 
    //work with element

La segunda forma no se puede utilizar si algunos elementos en array puede ser falso (no es su caso), pero puede ser más legible porque no necesita usar [] notación en todas partes.

Mi favorito es usar el operador de propagación para convertirlo a array y luego usar forEach para hacer bucles.

var div_list = document.querySelectorAll('div'); // returns NodeList
var div_array = [...div_list]; // converts NodeList to Array
div_array.forEach(div => 

// do something awesome with each div

);

Codifico en ES2015 y uso Babel.js, por lo que no debería haber un problema de compatibilidad con el navegador.

Una buena alternativa es:

[].forEach.call(
    document.querySelectorAll('.check'),
    function (el) 
        console.log(el);
    
);

pero como se señaló, debe usar un bucle for.

Ten en cuenta dar difusión a esta sección si te fue de ayuda.

¡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 *