2011-01-17 3 views
90

Sono nuovo di jQuery e mi chiedo quale sia la differenza tra le funzioni di jQuery get() e eq(). Potrei fraintendere ciò che fa la funzione get(), ma ho pensato che fosse strano non poter chiamare una funzione sul reso sull'elemento restituito nella stessa riga.jQuery: eq() vs get()

//Doesn't work 
I.e. $("h2").get(0).fadeIn("slow"); 

//Works 
$("h2").eq(0).fadeIn("slow"); 
+0

possibile duplicato del [differenza tra get() e eq() in jQuery] (http://stackoverflow.com/questions/4662301/difference-between-get-and-eq-in-jquery) – PeeHaa

risposta

174

.get() e .eq() restituiscono entrambi un singolo "elemento" da un array di oggetti jQuery, ma restituiscono il singolo elemento in forme diverse.

.eq() lo restituisce come un oggetto jQuery, ovvero l'elemento DOM viene avvolto nel wrapper jQuery, il che significa che accetta le funzioni jQuery.

.get() restituisce una matrice di elementi DOM non elaborati. Puoi manipolare ognuno di essi accedendo ai suoi attributi e invocando le sue funzioni come faresti su un elemento DOM grezzo. Ma perde la sua identità come oggetto jQuery, quindi una funzione jQuery come .fadeIn non funzionerà.

+0

Grazie per aver condiviso questo! – blackhawk

+7

.get() restituisce un array, .get (indice) restituisce il singolo elemento all'indice dall'array. –

14

get() restituisce un elemento DOM, mentre :eq() e eq() restituiscono un elemento di jQuery. Poiché gli elementi DOM non hanno alcun metodo fadeIn(), lo fallisce.

http://api.jquery.com/get/

Descrizione: Recuperare gli elementi DOM corrispondenti dall'oggetto jQuery.

http://api.jquery.com/eq-selector/

Descrizione: selezionare l'elemento in corrispondenza dell'indice n all'interno del gruppo unico.

5

eq(i) recupera il membro esimo insieme del ricevitore come oggetto jQuery, mentre get(i) restituisce l'elemento nella posizione esimo come elemento DOM.

Il motivo per cui questo non funziona:

$("h2").get(0).fadeIn("slow"); 

è perché l'elemento h2 DOM non ha un metodo chiamato fadeIn.

Si consiglia di utilizzare eq(0) qui.

11

get(0)(docs) restituisce il primo elemento DOM nel set.

eq(0)(docs) restituisce il primo elemento DOM nel set, racchiuso in un oggetto jQuery.

Ecco perché non funziona quando lo si fa .get(0). Un elemento DOM non ha un metodo fadeIn(), ma un oggetto jQuery lo fa.

6

a costruire sulle altre risposte:

$('h2').get(0) === $('h2').eq(0)[0] //true 
$($('h2').get(0)) === $('h2').eq(0) //true 
+1

Il primo è corretto. Il secondo non lo è. Questi 2 oggetti non sono la stessa cosa –

0

Io sto dando un esempio che spiega i punti dati da altri qui. considerare il seguente codice

<div id="example"> 
    Some text 
    <div>Another div</div> 
    <!--A comment--> 
</div> 

e il codice corrispondente js,

$(document).ready(function() { 
    var div = $("#example").get(0); 
    console.log(typeof(div)); 
    console.log(div); 
    console.log("XXXXXXXXX"); 
    var div_eq=$('#example').eq(0); 
    console.log(typeof(div_eq)); 
    console.log(div_eq); 
    }); 

Questo è quanto si vedrà

object 
excercise1.js (line 5) 
<div id="example"> 
excercise1.js (line 6) 
XXXXXXXXX 
excercise1.js (line 7) 
object 
excercise1.js (line 9) 
Object[div#example] 

Il primo è un oggetto DOM mentre il secondo è un Jquery -avvolto oggetto in cui è possibile chiamare i metodi di Jquery

0

jQuery eq() metodo seleziona un elemento HTML con un numero indice specifico.

Ecco un esempio di quella

<body> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 
</body> 

$("body").find("div").eq(2).addClass("red"); 
// it finds the second div in the html body and change it to red color. 

Fonte: http://www.snoopcode.com/JQuery/jquery-eq-selector

0

risposte di cui sopra hanno spiegato nello specifico e in modo corretto. Voglio aggiungere alcuni punti qui che potrebbero aiutare per l'uso di get().

  1. Se non si passa un argomento per .get(), verrà restituito un array di elementi DOM.

  2. Se hai un oggetto DOM utilizzando get(), come var s = $("#id").get(0) è possibile trasformarlo di nuovo in oggetto jQuery semplicemente utilizzando questo, $(s)

  3. È possibile utilizzare $obj[i] come un modo alternativo se non lo fai desidera utilizzare $obj.get(i), vedi sotto,

    var $obj = $("#ul li"); 
    var obj1 = $obj.get(1); 
    var obj2 = $obj[1]; 
    
    //true 
    return obj2===obj1;