Rumah > hujung hadapan web > tutorial js > Penjelasan terperinci tentang jQuery.each usage_jquery

Penjelasan terperinci tentang jQuery.each usage_jquery

WBOY
Lepaskan: 2016-05-16 15:51:10
asal
1218 orang telah melayarinya

Kaedah jQuery.each ialah salah satu kaedah alat teras jQuery Ia adalah kaedah lelaran umum yang boleh digunakan untuk mengulang objek dan tatasusunan. Berbeza dengan kaedah $().each(), yang melelaran ke atas objek jQuery, kaedah ini boleh digunakan untuk mengulangi sebarang objek. Biasanya memerlukan dua parameter

objek: Objek atau tatasusunan yang perlu dilalui.

panggilan balik: Fungsi panggil balik yang dilaksanakan oleh setiap ahli/elemen.

Fungsi panggil balik mempunyai dua parameter: yang pertama ialah ahli objek atau indeks tatasusunan, dan yang kedua ialah pembolehubah atau kandungan yang sepadan. Jika anda perlu keluar dari setiap gelung, anda boleh menjadikan fungsi panggil balik kembali palsu, dan nilai pulangan lain akan diabaikan.

Gelung melalui tatasusunan, menggunakan kedua-dua indeks elemen dan kandungan. Contohnya adalah seperti berikut:

//例遍对象,同时使用成员名称和变量内容。

$.each( [0,1,2], function(i, n){
 alert( "Item #" + i + ": " + n );
});
//例遍对象,同时使用成员名称和变量内容。

$.each( { name: "John", lang: "JS" }, function(i, n){
 alert( "Name: " + i + ", Value: " + n );
});

Salin selepas log masuk

Sudah tentu, anda juga boleh menggunakan panggilan contoh secara terus

  $( 'div' ).each( function(i,n){
    return i+n.text;
  } )
Salin selepas log masuk

Malah, kaedah contoh (prototaip) dalam kod sumber juga merupakan kaedah statik yang dipanggil, jadi untuk menganalisis setiap kaedah, anda hanya perlu menganalisis kaedah statiknya adalah hanya kes khas menggunakan kaedah statik.

// Execute a callback for every element in the matched set.
  // (You can seed the arguments with an array of args, but this is
  // only used internally.)
  each: function( callback, args ) {
    return jQuery.each( this, callback, args );
  },
Salin selepas log masuk

Dalam kaedah prototaip, hantar objek ini secara langsung sebagai objek yang akan dilalui Berikut ialah kod sumber kaedah statik

// args is for internal usage only
  each: function( object, callback, args ) {
    var name, i = 0,
      length = object.length,
      isObj = length === undefined || jQuery.isFunction( object );
    if ( args ) {
      if ( isObj ) {
        for ( name in object ) {
          if ( callback.apply( object[ name ], args ) === false ) {
            break;
          }
        }
      } else {
        for ( ; i < length; ) {
          if ( callback.apply( object[ i++ ], args ) === false ) {
            break;
          }
        }
      }

    // A special, fast, case for the most common use of each
    } else {
      if ( isObj ) {
        for ( name in object ) {
          if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
            break;
          }
        }
      } else {
        for ( ; i < length; ) {
          if ( callback.call( object[ i ], i, object[ i++ ] ) === false ) {
            break;
          }
        }
      }
    }

    return object;
  },

Salin selepas log masuk

Tidak banyak perkara Pertama sekali, ia menerima 3 parameter Pada masa ini, kita harus memberi perhatian kepada fakta bahawa manual yang sering kita gunakan biasanya menulis dua parameter, tetapi sebenarnya, dalam kod sumber, Terdapat 3 parameter yang boleh diterima, parameter ketiga ialah tatasusunan, yang akan dihantar sebagai parameter fungsi panggil balik.

Mula-mula mengisytiharkan beberapa pembolehubah i, nama dan panjang adalah untuk menyediakan gelung isObj adalah untuk membezakan sama ada parameter yang sesuai ialah tatasusunan atau objek parameter ialah fungsi atau atribut panjang tidak wujud , selebihnya dikendalikan sebagai tatasusunan atau seperti tatasusunan.

isObj = panjang === tidak ditentukan ||. jQuery.isFunction( objek );
Ayat ini ditulis dengan sangat ringkas dan menggunakan susunan keutamaan pengendali untuk melaksanakan dahulu ===

Malah, penghakiman jenis ini tidak begitu tepat, ia hanyalah satu perbezaan yang kasar, seperti:

 var obj={length:'a'};
 var isObj= obj.length=== undefined || jQuery.isFunction( obj );
 alert(isObj); //false
Salin selepas log masuk

Kemudian perbezaan adalah berdasarkan sama ada parameter ketiga ditambah Mari kita lihat situasi tanpa menambahnya, iaitu

} else {
      if ( isObj ) {
        for ( name in object ) {
          if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
            break;
          }
        }
      } else {
        for ( ; i < length; ) {
          if ( callback.call( object[ i ], i, object[ i++ ] ) === false ) {
            break;
          }
        }
      }
    }

Salin selepas log masuk

"Bezakan" tatasusunan dan objek berdasarkan pembolehubah isObj Gunakan gelung for untuk tatasusunan dan gelung untuk...dalam untuk objek Setiap kali gelung dilaksanakan, fungsi panggil balik akan dilaksanakan dan tatasusunan gelung semasa atau kunci objek dan nilai akan dilaksanakan, kaedah panggilan yang digunakan di sini, parameter pertama ialah "ini" fungsi, iaitu, nilai gelung semasa digunakan sebagai ini, dua seterusnya adalah kunci dan nilai atau penunjuk dan nilai, jadi kami menggunakan fungsi panggil balik dalam gelung Parameter kedua adalah sama seperti menggunakan ini. Contohnya:

//刚才的例子
 $( 'div' ).each( function(i,n){
    return i+n.text;
  } )
//等价于
 $( 'div' ).each( function(i,n){
    return i+this.text;
  } )

Salin selepas log masuk

Untuk kes di mana parameter ketiga ditambahkan, kaedah pemindahan nilai fungsi panggil balik digunakan untuk memindahkan parameter Ini masih menunjuk kepada nilai semasa, tetapi args ialah parameter ketiga diluluskan, dan fungsi panggil balik boleh menggunakan seberapa banyak parameter yang terdapat pada tatasusunan Apa yang perlu diperhatikan di sini ialah yang ketiga mestilah format tatasusunan asal js dan tidak boleh menjadi tatasusunan kelas atau objek jQuery, jika tidak ralat akan berlaku. dilaporkan kerana kaedah memohon tidak disokong. Jika fungsi panggil balik mengembalikan palsu, gelung akan dilangkau Contohnya, kita hanya boleh memproses tatasusunan subskrip bernombor ganjil dan apabila ia dinilai sebagai item bernombor genap, hanya laksanakan pulangan palsu dalam fungsi panggil balik

return object;
Salin selepas log masuk

Akhirnya kembalikan objek atau tatasusunan asal, dsb.

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan