Como obtenho o primeiro elemento em vez de usar [0] no jQuery?

91

Eu sou novo no jQuery, desculpe se esta é uma pergunta boba.

Quando eu uso o find um elemento usando o id, eu sei que sempre há uma correspondência e para acessá-lo eu usaria o índice [0]. Existe um jeito melhor de fazer isso? Por exemplo

var gridHeader = $("#grid_GridHeader")[0];
Rubans
fonte

Respostas:

98

Você também pode usar .get(0), mas ... você não deve precisar fazer isso com um elemento encontrado por ID, que deve ser sempre único. Espero que seja apenas um descuido no exemplo ... se este for o caso em sua página real, você precisará corrigi-lo para que seus IDs sejam únicos e usar uma classe (ou outro atributo) em seu lugar.

.get()(como [0]) obtém o elemento DOM, se você quiser que um objeto jQuery use .eq(0)ou em .first()vez disso :)

Nick Craver
fonte
17
Exceto que$("#id") /* jQuery object */ != $("#id").get(0) /* DOM Object */
BrunoLM
9
@BrunoLM - Se você quiser um elemento DOM, document.getElementById('id')não crie um objeto jQuery apenas para jogá-lo fora ... isso é um desperdício tremendo, do mecanismo do seletor ao invólucro do objeto, é um exagero sem uma boa razão :)
Nick Craver
Nick: Eu concordo, talvez eu estivesse sendo um tanto bobo apenas usando jquery para tudo.
Rubans
2
@NickCraver - Obrigado por isso. Acabei de substituir um monte de document.getElementById('id')com, $('#id')[0]mas não gostei do [0]. Seu comentário sobre desperdício me fez pensar em definir $0 = function(id){return document.getElementById(id);}e agora gosto $0('id')mais. Mesmo número de caracteres que $('#id'), eu só queria que fosse$#('id')
Bruno Bronosky
2
Gostaria que houvesse uma variante desses métodos que retornasse um valor falso de um conjunto de resultados vazio.
Stephen M. Harris
25

$("#grid_GridHeader:first") funciona bem.

Mervyn
fonte
3
Acho que esta é a melhor maneira de lidar com seu problema aqui. Lê-se bem, ao contrário de .eq (0)
Dave Gregory
18

Você pode usar o primeiro método:

$('li').first()

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

btw, eu concordo com Nick Craver - use document.getElementById () ...

Bennidhamma
fonte
1
Isso retorna uma matriz vazia se nenhum elemento for encontrado. Seja cuidadoso ao usar as instruções lógicas, pois []irá avaliar true.
Ashley
4

Com a suposição de que há apenas um elemento:

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

... são todos equivalentes, retornando o único elemento subjacente.

A partir do código-fonte do jQuery, você pode ver que get(0), nos bastidores, essencialmente faz a mesma coisa que a [0]abordagem:

 // Return just the object
 ( num < 0 ? this.slice(num)[ 0 ] : this[ num ] );
Ken Redler
fonte
Obrigado por tudo o resto funciona além de get () que não parece obter o primeiro item.
Rubans
Na verdade, posso ver na resposta de Nick Crave por que isso não funcionará
Rubans
3

Você pode usar o primeiro seletor.

var header = $('.header:first')
Matt
fonte
Retorna uma matriz com um único elemento.
Nitin de
-3

Você pode tentar assim:
yourArray.shift()

hjijin
fonte