Sélection des premiers «n» éléments avec jQuery

217

Avec Jquery, je dois sélectionner uniquement les premiers "n" éléments de la page, par exemple les 20 premiers liens au lieu de les sélectionner tous avec l'habituel

$("a")

Cela semble simple, mais le manuel jQuery n'a aucune preuve de quelque chose comme ça.

jquery

— Omiod
source

378

Vous voulez probablement lire sur tranche . Votre code ressemblera à ceci:

$("a").slice(0,20)

— dérangeant
source

65

Bien que l' :lt(20)approche semble beaucoup plus propre, l'utilisation de la tranche est beaucoup plus efficace si vous avez un ensemble de résultats important pour commencer. Malheureusement, lors de l'évaluation de ": lt" et d'autres sélecteurs de position, jQuery parcourt l'ensemble entier , même s'il ne s'agit que du premier élément. J'ai écrit plus à ce sujet sur mon blog ici: spadgos.com/?p=51

— nickf

1

Merci, une exigence secondaire de ma demande concernait les performances, donc c'est la bonne réponse pour moi. Merci aux autres d'avoir signalé aussi le sélecteur: lt.

— Omiod

3

Commentaire informatif de @nickf, mais le lien du blog et le lien du graphique ne semblent pas fonctionner

— Fractalf

1

Impossible de modifier maintenant désolé - en gros, l'utilisation de la tranche était beaucoup plus rapide.

— nickf

92

Utilisez le pseudo sélecteur lt:

$("a:lt(n)")

Cela correspond aux éléments avant le nième (le nième élément exclu). La numérotation commence à 0.

— kgiannakakis
source

13

Selon les documents jQuery , .slice est plus rapide dans les navigateurs modernes.

— Blaise

1

J'aime l'utilisation du style jQuery, c'est plus élégant que le chaînage.

— Fedir RYKHTIK

22

J'ai trouvé cette note à la fin des documents lt () :

Notes supplémentaires:
Parce que: lt () est une extension jQuery et ne fait pas partie de la spécification CSS, les requêtes utilisant: lt () ne peuvent pas tirer parti de l'amélioration des performances fournie par la méthode native DOM querySelectorAll (). Pour de meilleures performances dans les navigateurs modernes, utilisez plutôt $ ("your-pure-css-selector"). Slice (0, index).

Utilisez donc $("selector").slice(from, to)pour de meilleures performances.

— Arlind Nushi
source

11

Essayez le sélecteur: lt: http://docs.jquery.com/Selectors/lt#index

$('a:lt(20)');

— David Hellsing
source

7

.slice () n'est pas toujours mieux. Dans mon cas, avec jQuery 1.7 dans Chrome 36, .slice (0, 20) a échoué avec l'erreur:

RangeError: taille maximale de la pile d'appels dépassée

J'ai trouvé que: lt (20) fonctionnait sans erreur dans ce cas. J'avais probablement des dizaines de milliers d'éléments correspondants.

— Kevin Gwynn
source

2

$("a:lt(n)")

Documentation JQuery

— hsz
source