web-dev-qa-db-fra.com

itération récursive jQuery sur des objets

L'autre jour, je pensais avoir vu un itérateur d'objets dans jQuery qui avait un indicateur qui pouvait être défini pour itérer récursivement sur des objets enfants. Je pensais que cela faisait partie de jQuery.each (), mais maintenant je ne vois pas cette capacité dans les documents.

Existe-t-il un tel itérateur dans jQuery qui peut être automatiquement récursif?

(Je sais comment le faire en javascript. Je me demande simplement si j'ai vraiment vu ce que je pensais avoir vu.)

Merci beaucoup!

EDIT: Pour être clair, je pensais à une méthode utilitaire comme jQuery.each () qui itérerait récursivement sur les objets javascript et leurs objets imbriqués.

Étant donné l'exemple ci-dessous, la méthode each () itérerait sur tous les objets, y compris celui imbriqué dans myobj.obj2.key2.

J'aurais juré avoir vu quelque chose dans les documents jQuery à ce sujet, mais maintenant je ne le trouve plus.

Merci.

var myobj = {
    obj1: {key1:'val1', key2:'val2'},
    obj2: {key1:'val1', key2: {nest1:'val1', nest2:'val2', nest3:'val3'}},
    obj3: {key1:'val1', key2:'val2'}
}

$jQuery.each(myobj, function(key,val) {
    // Code to run over each key/val pair
    // Does so recursively to include all nested objects
})
jqueryjsonobjectiterationrecursion
29
user113716

La méthode .find ('selector') est fondamentalement une version récursive de .children (), et trouvera tout objet descendant qui correspondait au sélecteur, par opposition à .children () qui ne trouve que des objets dans le premier niveau de descendants.

2ème EDIT (j'ai mal formulé la première fois, et j'ai un peu foiré le code!):

Ok, je ne pense pas que cette fonctionnalité en tant que drapeau ait un sens: vous pouvez très heureusement récurer à travers cet objet pour toujours (croyez-moi, j'ai cassé Firefox en le faisant), donc vous avez besoin d'une sorte d'interaction pour vous assurer que vous ne récursiez que lorsque l'objet enfant est un candidat de récursivité valide.

Ce que vous devez faire est simplement de diviser la fonction comme suit:


var myobj = {
    obj1: {key1:'val1', key2:'val2'},
    obj2: {key1:'val1', key2: {nest1:'val1', nest2:'val2', nest3:'val3'}},
    obj3: {key1:'val1', key2:'val2'}
}


$jQuery.each(myobj, function(key, val) { recursiveFunction(key, val) });

    function recursiveFunction(key, val) {
        actualFunction(key, val);
        var value = val['key2'];
        if (value instanceof Object) {
            $.each(value, function(key, val) {
                recursiveFunction(key, val)
            });
        }

    }
</code>

function actualFunction (key, val) {
 /// faire des choses 
}
37
Ed James

Une version légèrement simplifiée de la version de @Ed Woodcock ci-dessus. La façon dont j'avais besoin de l'utiliser était de produire une liste à puces HTML avec des liens nommés.

var list = "<ul>";
$.each(data, recurse);

function recurse(key, val) {
    list += "<li>";
    if (val instanceof Object) {
        list += key + "<ul>";
        $.each(val, recurse);
        list += "</ul>";
    } else {
        list += "<a href='" + val + "'>" + key + "</a>";
    }
    list += "</li>";
}
list += "</ul>";

$("#container").html(list);
9
CBarr

vous pouvez le faire beaucoup plus facilement en tant que tel

$(this).children().each(function(index, element) {
...
});
0
Justin T. Watts

Ces questions et réponses ont été très utiles. Je vous remercie. (J'ai également apprécié la référence aux cookies. Je continue de parcourir ce livre!).

Voici ma version faisant une "recherche et remplacement" pour une simple solution i18n jQuery (cela peut être utile à quelqu'un). Il trouve que le terme encapsulé dans une classe le remplace si le terme est dans le dictionnaire.

Violon: http://jsfiddle.net/orolo/CeY5Y/11/

HTML:

In the <span class="i18n">Clear</span> and also <span class="i18n">Save Widget</span>. I'm <span class="i18n">On</span> the <span class="i18n">sub3</span> and <span class="i18n">PDF</span>.

javascript/jQuery:

var term = "";

var customDict = {
    "Level One": {
        "Clear": "1234",
        "CSV": "CSV",
        "First": "First",
        "Last": "Last",
        "Next": "Next",
        "On": "42",
        "Off": "Off",
        "PDF": "alpha",
        "Prev": "Prev",
        "Rows": "Rows",
        "Save Widget": "saver widgetor",
        "Stats": "statistiques",
        "sub": {
            "sub2": {
                "sub3": "inception"
            }
        }
    }
};

function recursiveLookup(key, val) {
    //test for a match between term and key
    if (key === term) {
        $('.i18n').each(function() {
            if ($(this).text() === key) {
              $(this).text(val);  
            }
        });
    }
    //val is an object or no match? recur
    if (val instanceof Object) {
        $.each(val, function(key1, val1) {
            recursiveLookup(key1, val1);
        });
    }
}

function convert() {    
    $('.i18n').each(function(key, val) {
        term = $(this).text();  
        $.each(customDict, function(key, val) {
            recursiveLookup(key, val);
        });

    });
}


/*call the function*/
convert();
0
orolo