web-dev-qa-db-fra.com

jquery $ ('. class'). each () combien d'éléments?

Lorsque vous passez en boucle sur un groupe d'éléments à l'aide des sélecteurs jQuery, existe-t-il un moyen de déterminer le nombre d'éléments présents dans la collection?

jqueryjquery-selectors
37
Hailwood

Si vous utilisez une syntaxe chaînée:

$(".class").each(function() {
    // ...
});

... Je ne pense pas qu'il existe un moyen (raisonnable) pour le code dans la fonction each de savoir combien d'éléments il y a. (Déraisonnable moyens impliqueraient de répéter le sélecteur et d'utiliser index.)

Mais il est assez facile de rendre la collection disponible pour la fonction que vous appelez dans each. Voici une façon de le faire:

var collection = $(".class");
collection.each(function() {
    // You can access `collection.length` here.
});

En tant qu'option un peu compliquée, vous pouvez convertir votre objet jQuery en un tableau, puis utiliser le forEach du tableau. Les arguments qui sont passés au rappel de forEach sont l'entrée en cours de visite (ce que jQuery vous donne sous la forme this et en tant que l'argument second), l'index de cette entrée, et le tableau sur lequel vous l'avez appelé:

$(".class").get().forEach(function(entry, index, array) {
    // Here, array.length is the total number of items
});

Cela suppose au moins vaguement moteur JavaScript moderne et/ou une cale pour Array#forEach.

Ou d'ailleurs, donnez-vous un nouvel outil:

// Loop through the jQuery set calling the callback:
//    loop(callback, thisArg);
// Callback gets called with `this` set to `thisArg` unless `thisArg`
// is falsey, in which case `this` will be the element being visited.
// Arguments to callback are `element`, `index`, and `set`, where
// `element` is the element being visited, `index` is its index in the
// set, and `set` is the jQuery set `loop` was called on.
// Callback's return value is ignored unless it's `=== false`, in which case
// it stops the loop.
$.fn.loop = function(callback, thisArg) {
    var me = this;
    return this.each(function(index, element) {
        return callback.call(thisArg || element, element, index, me);
    });
};

Usage:

$(".class").loop(function(element, index, set) {
    // Here, set.length is the length of the set
});
94
T.J. Crowder

Si vous utilisez une version de jQuery antérieure à la version 1.8, vous pouvez utiliser le paramètre $ ('. Class'). Size (), qui prend zéro paramètre. Voir documentation pour plus d'informations sur la méthode .size ().

Toutefois, si vous utilisez (ou prévoyez de mettre à niveau) à 1.8 ou plus, vous pouvez utiliser la propriété $ ('. Class'). Length. Voir documentation pour plus d'informations sur la propriété .length.

4
darkwisperer

Utilisez le .length propriété. C'est pas une fonction.

alert($('.class').length); // alerts a nonnegative number
4
Matt Ball

Vous voulez dire comme length ou size()?

Références: http://api.jquery.com/length/

1
kojiro