¿Cómo puedo iterar a través de elementos secundarios de un div usando jQuery?

Question

Tengo un div y tiene varios elementos de entrada ... Me gustaría iterar a través de cada uno de esos elementos. Ideas?

Answer 1

Uso children() y each(), se puede pasar opcionalmente un selector para children

$('#mydiv').children('input').each(function() { 
    alert(this.value); // "this" is the current element in the loop 
}); 

También puede simplemente utilizar el selector secundario inmediato:

$('#mydiv > input').each(function() { /* ... */ }); 

Answer 2

También es posible recorrer todos los elementos dentro de un contexto específico, no importa cuán profundamente anidados estén:

$('input', $('#mydiv')).each(function() { 
    console.log($(this)); //log every element found to console output 
}); 

El segundo parámetro $ ('# mydiv') que se pasa al jQuery 'entrada' Selector es el contexto. En este caso, la cláusula each() repetirá a través de todos los elementos de entrada dentro del contenedor #mydiv, incluso si no son hijos directos de #mydiv.

Answer 3

Si necesita colocar a través de elementos secundarios de forma recursiva :

function recursiveEach($element){ 
    $element.children().each(function() { 
     var $currentElement = $(this); 
     //////////// Show element 
     console.info($currentElement); 
     //////////// Show events handlers of current element 
     console.info($currentElement.data('events')); 
     //////////// Loop her children 
     recursiveEach($currentElement); 
    }); 
} 

//////////// Parent div 
recursiveEach($("#div")); 

---

NOTA: En este ejemplo muestro los eventos registrados manipuladores con un objeto.

Answer 4

Se puede hacer de esa manera también.
$('input', '#div').each(function() { console.log($(this)); //log every element found to console output });