Cara memeriksa objek nol di jQuery

169

Saya menggunakan jQuery dan saya ingin memeriksa keberadaan elemen di halaman saya. Saya telah menulis kode berikut, tetapi tidak berfungsi:

if($("#btext" + i) != null) {
    //alert($("#btext" + i).text());
    $("#btext" + i).text("Branch " + i);
}

Bagaimana cara memeriksa keberadaan elemen?

Prashant
sumber

Jawaban:

251

Periksa FAQ jQuery ...

Anda dapat menggunakan properti panjang dari koleksi jQuery yang dikembalikan oleh pemilih Anda:

if ( $('#myDiv').length ){}
Christoph
sumber
apa pendapat Anda tentang var _myDiv = $ ('# myDiv'); ... .... if (_myDiv.lenght) {...} menghasilkan pengecualian.
Nuri YILMAZ
1
seperti kata eleotlecram; lebih baik hindari
.length
5
@AurelianoBuendia, Anda telah menggunakan lenghtbukannya length; ini merupakan kesalahan pengejaan.
Sam
4
@numediaweb, eleotlecram tidak mengatakan untuk menghindari .length.
Sam
1
tapi .. tidakkah Anda akan mendapatkan kesalahan "Tidak bisa membaca properti 'panjang dari nol"?
Sagive SEO
61

(Karena aku tampaknya tidak memiliki reputasi yang cukup untuk memberikan jawaban ...)

Wolf menulis:

Properti panjang panggilan pada objek tidak terdefinisi atau null akan menyebabkan browser IE dan webkit gagal!

Alih-alih coba ini:

 // NOTE!! THE FOLLOWING IS WRONG; DO NOT USE!  -- EleotleCram
if($("#something") !== null){
  // do something
}

atau

 // NOTE!! THE FOLLOWING IS WRONG; DO NOT USE!  -- EleotleCram
if($("#something") === null){
  // don't do something
}

Meskipun benar bahwa memanggil properti panjang pada objek yang tidak terdefinisi atau null akan menyebabkan browser gagal, hasil dari pemilih jQuery ($ ('...')) tidak akan pernah menjadi nol atau tidak terdefinisi. Jadi saran kode tidak masuk akal. Gunakan salah satu dari jawaban lain, itu lebih masuk akal.


(Pembaruan 2012) Karena orang-orang melihat kode dan jawaban ini cukup tinggi dalam daftar: Untuk beberapa tahun terakhir, saya telah menggunakan plugin kecil ini:

  jQuery.fn['any'] = function() {
     return (this.length > 0);
  };

Saya pikir $ ('div'). Any () membaca lebih baik dari $ ('div'). Panjang , ditambah Anda tidak akan menderita banyak dari kesalahan ketik: $ ('div'). Ayn () akan memberikan kesalahan runtime , $ ('div'). Panjang akan diam-diam kemungkinan besar selalu palsu.

__
Pengeditan November 2012:

1) Karena orang cenderung melihat kode dan tidak membaca apa yang dikatakan di sekitar kode, saya menambahkan dua catatan lektor peringatan besar ke kode Wolf yang dikutip.
2) Saya menambahkan kode plugin kecil yang saya gunakan untuk situasi ini.

eleotlecram
sumber
2
@VovaPopov: Saya sarankan lain kali Anda mengambil lebih banyak waktu untuk membaca jawabannya. Saya hanya menyatakan bahwa contoh kode "oleh Wolf" tidak benar. Saya tidak pernah memberikan jawaban, hanya merujuk ke beberapa jawaban lain yang lebih masuk akal.
eleotlecram
Jawaban yang bagus. Maaf orang salah mengartikannya.
Joe Simmons
14

Fungsi pencarian mengembalikan array elemen yang cocok. Anda dapat memeriksa apakah panjangnya nol. Perhatikan perubahan hanya untuk mencari elemen sekali dan menggunakan kembali hasilnya sesuai kebutuhan.

var elem = $("#btext" + i);
if (elem.length != 0) {
   elem.text("Branch " + i);
}

Juga, sudahkah Anda mencoba hanya menggunakan fungsi teks - jika tidak ada elemen, itu tidak akan melakukan apa-apa.

$("#btext" + i).text("Branch " + i);
tvanfosson
sumber
7
0 adalah nilai salah, jadi ekspresi elem.length dievaluasi menjadi false - dengan kata lain, tidak perlu untuk bagian '! = 0'
James
2
@ 999, saya pikir pemeriksaan terhadap nol membuat kode lebih mudah dibaca, meskipun kedua cara kemungkinan dapat dibaca oleh seseorang yang terbiasa dengan bahasa scripting.
Sam
12

fungsi jquery $ () selalu mengembalikan nilai bukan nol - elemen rata-rata cocok dengan Anda pemilih kretaria. Jika elemen tidak ditemukan, itu akan mengembalikan array kosong. Jadi kode Anda akan terlihat seperti ini -

if ($("#btext" + i).length){
        //alert($("#btext" + i).text());
    $("#btext" + i).text("Branch " + i);
}
Waney
sumber
1
Saya tidak berpikir benar bahwa $ () mengembalikan array. Objek jQuery memiliki perilaku yang mirip dengan array, tapi saya tidak berpikir mereka sebenarnya array, dan saya pikir Anda akan menemukan bahwa tidak semua perilaku mereka sama dengan array. Lihat demonstrasi cepat ini .
Sam
5

Di jQuery 1.4 Anda mendapatkan fungsi $ .isEmptyObject, tetapi jika Anda terpaksa menggunakan versi jQ yang lebih lama seperti kami, pengembang Drupal yang malang, curi saja gunakan kode ini:

// This is a function similar to the jQuery 1.4 $.isEmptyObject.
function isObjectEmpty(obj) {
  for ( var name in obj ) {
    return false;
  }
  return true;
}

Gunakan seperti:

console.log(isObjectEmpty(the_object)); // Returns true or false.
theamoeba
sumber
Ini tidak menjawab pertanyaan.
Sam
5

apa pun pilihan Anda, fungsi $()selalu mengembalikan objek jQuery sehingga tidak dapat digunakan untuk menguji. Cara terbaik (jika bukan satu-satunya) adalah menggunakan size()fungsi atau properti panjang asli seperti dijelaskan di atas.

if ( $('selector').size() ) {...}                   
burntblark
sumber
3
if ( $('#whatever')[0] ) {...}

Objek jQuery yang dikembalikan oleh semua metode jQuery asli BUKAN array, itu adalah objek dengan banyak properti; salah satunya menjadi properti "panjang". Anda juga dapat memeriksa ukuran () atau mendapatkan (0) atau mendapatkan () - 'get (0)' berfungsi sama dengan mengakses elemen pertama, yaitu $ (elem) [0]

James
sumber
3

Bagaimana dengan menggunakan "undefined"?

if (value != undefined){ // do stuff } 
Hugh Seagraves
sumber
1

gunakan $("#selector").get(0)untuk memeriksa dengan null seperti itu. dapatkan kembalikan elemen dom, sampai kemudian Anda berurusan dengan sebuah array, di mana Anda perlu memeriksa properti length. Saya pribadi tidak suka pemeriksaan panjang untuk penanganan null, ini membingungkan saya karena beberapa alasan :)

Emre
sumber
Sangat menarik cara orang berbeda berpikir berbeda; Saya pikir lebih masuk akal untuk memeriksa apakah jumlah elemen adalah nol daripada memeriksa apakah elemen pertama ada.
Sam
1

Menggunakan properti panjang Anda bisa melakukan ini.

jQuery.fn.exists = function(){return ($(this).length < 0);}
if ($(selector).exists()) { 
   //do somthing
}
Suresh Pattu
sumber
2
Apakah maksud Anda (ini). Panjang> 0?
sage88
0

ketika objek kosong kembalikan kesalahan ini:

Uncaught TypeError: Cannot read property '0' of null

Saya mencoba kode ini:

try{
  if ($("#btext" + i).length) {};               
}catch(err){
  if ($("#btext" + i).length) {
     //working this code if the item, not NULL 
   }
}
ahmadjn
sumber
-4
if (typeof($("#btext" + i)) == 'object'){
    $("#btext" + i).text("Branch " + i);
}
한지 만
sumber
-7

Properti panjang panggilan pada objek yang tidak terdefinisi atau null akan menyebabkan browser IE dan webkit gagal!

Alih-alih coba ini:

if($("#something") !== null){
  // do something
}

atau

if($("#something") === null){
  // don't do something
}
Serigala
sumber