jQuery: eq () vs get ()

98

Saya baru mengenal jQuery, dan saya bertanya-tanya apa perbedaan antara jQuery get()dan eq()fungsi. Saya mungkin salah paham apa get()fungsinya, tapi saya pikir itu aneh bahwa saya tidak bisa memanggil fungsi yang dikembalikan pada elemen yang dikembalikan di baris yang sama.

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

//Works
$("h2").eq(0).fadeIn("slow");
jquery jquery-selectors contactmatt
sumber
1
kemungkinan duplikat perbedaan antara get () dan eq () di jquery
PeeHaa
Kemungkinan duplikat dari Apa perbedaan antara get () dan eq () di jquery?
xhienne

Jawaban:

194

.get()dan .eq()keduanya mengembalikan satu "elemen" dari larik objek jQuery, tetapi mereka mengembalikan satu elemen dalam bentuk yang berbeda.

.eq() mengembalikannya sebagai objek jQuery, yang berarti elemen DOM dibungkus dalam pembungkus jQuery, yang berarti menerima fungsi jQuery.

.get()mengembalikan larik elemen DOM mentah. Anda dapat memanipulasi masing-masing dengan mengakses atributnya dan menjalankan fungsinya seperti yang Anda lakukan pada elemen DOM mentah. Tapi itu kehilangan identitasnya sebagai objek yang dibungkus jQuery, jadi fungsi jQuery .fadeIntidak akan berfungsi.

Steven
sumber
8
.get () mengembalikan sebuah array, .get (index) mengembalikan elemen tunggal pada indeks dari array.
Mohamed Fasil
16

get()mengembalikan elemen DOM sedangkan :eq()dan eq()mengembalikan elemen jQuery. Karena elemen DOM tidak memiliki metode fadeIn()itu gagal .

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

Deskripsi: Mengambil elemen DOM yang cocok dengan objek jQuery.

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

Deskripsi: Pilih elemen di indeks n dalam set yang cocok.

pemburu
sumber
12

get(0)(docs) mengembalikan elemen DOM pertama dalam set.

eq(0)(docs) mengembalikan elemen DOM pertama dalam set, dibungkus dalam objek jQuery.

Itulah mengapa .fadeIn("slow");tidak berhasil saat Anda melakukannya .get(0). Elemen DOM tidak memiliki fadeIn()metode, tetapi objek jQuery memilikinya.

pengguna113716
sumber
6

Untuk mengembangkan jawaban lain:

$('h2').get(0) === $('h2').eq(0)[0]  //true
$( $('h2').get(0) ) === $('h2').eq(0)  //true
qwertymk.dll
sumber
1
Yang pertama benar. Yang kedua tidak. 2 objek itu tidak sama
Royi Namir
5

eq(i)mengambil anggota ke-i di set penerima sebagai jQueryobjek, sementara get(i)mengembalikan anggota di posisi ke-i sebagai elemen DOM.

Alasan mengapa ini tidak berhasil:

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

Karena h2elemen DOM tidak memiliki metode yang dipanggil fadeIn.

Anda harus menggunakan di eq(0)sini sebagai gantinya.

Jacob Relkin
sumber
0

Saya memberikan contoh yang menjelaskan poin-poin yang diberikan oleh orang lain di sini. perhatikan kode berikut

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

dan kode js yang sesuai,

$(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);
    });

Inilah yang akan Anda lihat

 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]

Yang pertama adalah objek DOM sedangkan yang terakhir adalah objek yang dibungkus Jquery tempat Anda dapat memanggil metode Jquery

badai otak
sumber
0

jQuery eq () metode memilih elemen HTML dengan nomor indeks tertentu.

Ini adalah contohnya

<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.

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

Prabhakar Undurthi
sumber
"ia menemukan div kedua" => tidak eq(2)mengembalikan div ketiga?
xhienne
0

Jawaban di atas sudah dijelaskan secara spesifik dan benar. Saya ingin menambahkan beberapa poin di sini yang mungkin bisa membantu untuk penggunaan get().

  1. Jika Anda tidak meneruskan argumen ke .get(), itu akan mengembalikan Array dari elemen DOM.

  2. Jika Anda menggunakan objek DOM get(), seperti var s = $("#id").get(0) Anda dapat mengubahnya kembali menjadi objek jQuery hanya dengan menggunakan ini,$(s)

  3. Anda dapat menggunakan $obj[i]sebagai cara alternatif jika Anda tidak ingin menggunakan $obj.get(i), lihat di bawah,

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

//true
return obj2===obj1;
SkuraZZ
sumber