Comment parcourir les éléments enfants d'une div à l'aide de jQuery?

J'ai un div et il contient plusieurs éléments d'entrée ... Je voudrais parcourir chacun de ces éléments. Des idées?

Utilisez children()et each(), vous pouvez éventuellement passer un sélecteur àchildren

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

Vous pouvez également simplement utiliser le sélecteur d'enfant immédiat:

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

Il est également possible de parcourir tous les éléments dans un contexte spécifique, peu importe à quel point ils sont imbriqués:

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

Le deuxième paramètre $ ('# mydiv') qui est passé au sélecteur jQuery 'input' est le contexte. Dans ce cas, la clause each () parcourra tous les éléments d'entrée du conteneur #mydiv, même s'ils ne sont pas des enfants directs de #mydiv.

Si vous devez parcourir les éléments enfants de manière récursive :

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"));   

REMARQUE: dans cet exemple, je montre les gestionnaires d'événements enregistrés avec un objet.

Cela peut également être fait de cette façon:

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

$('#myDiv').children().each( (index, element) => {
    console.log(index);     // children's index
    console.log(element);   // children's element
 });

Cela parcourt tous les enfants et leur élément avec une valeur d'index est accessible séparément en utilisant respectivement element et index .

children () est une boucle en soi.

$('.element').children().animate({
'opacity':'0'
});

Je ne pense pas que vous ayez besoin d'utiliser each(), vous pouvez utiliser la boucle standard

var children = $element.children().not(".pb-sortable-placeholder");
for (var i = 0; i < children.length; i++) {
    var currentChild = children.eq(i);
    // whatever logic you want
    var oldPosition = currentChild.data("position");
}

de cette façon, vous pouvez avoir la norme pour les fonctionnalités de boucle comme breaket continuefonctionne par défaut

également debugging will be easier