Comment obtenir le premier élément plutôt que d'utiliser [0] dans jQuery?

91

Je suis nouveau sur jQuery, excuses si c'est une question idiote.

Quand je l'utilise, trouve un élément en utilisant l'identifiant, je sais qu'il y a toujours une correspondance et pour y accéder, j'utiliserais l'index [0]. Existe-t-il une meilleure façon de le faire? Pour par exemple

var gridHeader = $("#grid_GridHeader")[0];
javascript jquery Rubans
la source

Réponses:

98

Vous pouvez également l'utiliser .get(0)mais ... vous ne devriez pas avoir besoin de le faire avec un élément trouvé par ID, qui devrait toujours être unique. J'espère que ce n'est qu'un oubli dans l'exemple ... si c'est le cas sur votre page réelle, vous devrez le réparer pour que vos identifiants soient uniques et utiliser une classe (ou un autre attribut) à la place.

.get()(comme [0]) obtient l'élément DOM, si vous voulez qu'un objet jQuery utilise .eq(0)ou à la .first()place :)

Nick Craver
la source
17
Sauf que$("#id") /* jQuery object */ != $("#id").get(0) /* DOM Object */
BrunoLM
9
@BrunoLM - Si vous voulez un élément DOM,, document.getElementById('id')ne créez pas un objet jQuery juste pour le jeter ... c'est un gaspillage énorme, du moteur de sélection au wrapper d'objet, c'est juste exagéré sans raison valable :)
Nick Craver
Nick Je suis d'accord, peut-être que j'étais plutôt stupide en utilisant jquery pour tout.
Rubans
2
@NickCraver - Merci pour cela. Je viens de remplacer un tas de document.getElementById('id')par $('#id')[0]mais je n'ai pas aimé le [0]. Votre commentaire sur le gaspillage m'a fait réfléchir à définir $0 = function(id){return document.getElementById(id);}et maintenant j'aime $0('id')mieux. Même nombre de caractères que $('#id'), j'aimerais juste que ça puisse être$#('id')
Bruno Bronosky
2
J'aimerais qu'il y ait une variante de ces méthodes qui renvoie une valeur falsifiée à partir d'un ensemble de résultats vide.
Stephen M. Harris
25

$("#grid_GridHeader:first") fonctionne aussi bien.

Mervyn
la source
3
Je pense que c'est la meilleure façon de traiter votre problème ici. Il se lit bien, par opposition à .eq (0)
Dave Gregory
18

Vous pouvez utiliser la première méthode:

$('li').first()

http://api.jquery.com/first/

btw je suis d'accord avec Nick Craver - utilisez document.getElementById () ...

Bennidhamma
la source
1
Cela renvoie un tableau vide si aucun élément n'est trouvé. Soyez prudent lorsque vous utilisez dans les instructions logiques comme cela []sera évalué true.
Ashley
4

Avec l'hypothèse qu'il n'y a qu'un seul élément:

 $("#grid_GridHeader")[0]
 $("#grid_GridHeader").get(0)
 $("#grid_GridHeader").get()

... sont tous équivalents, renvoyant le seul élément sous-jacent.

À partir du code source de jQuery, vous pouvez voir que get(0) , sous les couvertures, fait essentiellement la même chose que l' [0]approche:

 // Return just the object
 ( num < 0 ? this.slice(num)[ 0 ] : this[ num ] );
Ken Redler
la source
Merci pour tout ce qui fonctionne à part get () qui ne semble pas obtenir le premier élément.
Rubans
En fait, je peux voir de la réponse de Nick Crave pourquoi cela ne fonctionnera pas
Rubans
3

Vous pouvez utiliser le premier sélecteur.

var header = $('.header:first')
Mat
la source
Renvoie un tableau avec un seul élément.
Nitin le
-3

Vous pouvez essayer comme ceci:
yourArray.shift()

hjijin
la source