Isi kandungan:
- Cara menggunakan $ (dokumen). siap ()
- Menggunakan dokumen. mekanisme siap
- Alternatif untuk dokumen. siap
Video: Laravel Model dan menampilkan isi tabel 2024
Banyak halaman HTML5 dan CSS3 memerlukan fungsi permulaan. Mekanisme onload badan sering digunakan dalam DOM / JavaScript untuk membuat halaman memuatkan sebaik sahaja dokumen telah mula dimuatkan. Ini adalah fungsi yang berjalan awal untuk menubuhkan seluruh halaman. Ketika beban body melakukan tugas ini dengan baik, beberapa masalah ada dengan teknik tradisional:
-
Ini memerlukan membuat perubahan pada HTML. Kod JavaScript harus dipisahkan sepenuhnya dari HTML. Anda tidak perlu mengubah HTML anda untuk menjadikannya berfungsi dengan JavaScript.
-
Masa tetap masih tidak betul. Kod yang dinyatakan dalam onload badan tidak dilaksanakan sehingga selepas seluruh halaman dipaparkan. Adalah lebih baik jika kod didaftarkan selepas DOM dimuat tetapi sebelum memaparkan halaman.
Cara menggunakan $ (dokumen). siap ()
jQuery mempunyai alternatif yang hebat untuk onload badan yang mengatasi kekurangan ini. Lihatlah kod untuk melihat bagaimana ia berfungsi:
bersedia. html $ (dokumen). siap (changeMe); fungsi changeMe () {$ ("# output"). html ("Saya telah berubah");}Menggunakan dokumen. mekanisme siap
Adakah perubahan ini?
Kod ini menggunakan teknik jQuery untuk menjalankan kod permulaan:
-
Tag tubuh tidak lagi mempunyai atribut onload . Ini adalah ciri umum pemrograman jQuery. HTML tidak lagi mempunyai pautan langsung ke JavaScript kerana jQuery membolehkan kod JavaScript melampirkan dirinya ke laman web.
-
Fungsi permulaan dibuat dengan $ (dokumen). fungsi siap () . Teknik ini memberitahu pelayar untuk melaksanakan fungsi apabila DOM telah selesai dimuatkan (supaya ia mempunyai akses kepada semua elemen borang) tetapi sebelum halaman dipaparkan (supaya sebarang kesan bentuk muncul dengan serta-merta kepada pengguna).
-
$ document membuat objek jQuery dari seluruh dokumen. Seluruh dokumen boleh diubah menjadi objek jQuery dengan menentukan dokumen dalam fungsi $ (). Perhatikan bahawa anda tidak menggunakan tanda petikan dalam kes ini.
-
Fungsi yang dinyatakan secara automatik dijalankan. Dalam kes ini, anda ingin menjalankan fungsi changeMe (), jadi anda meletakkannya dalam parameter kaedah siap (). Perhatikan bahawa ini merujuk kepada changeMe sebagai pemboleh ubah, jadi ia tidak mempunyai tanda petikan atau kurungan.
Anda melihat beberapa tempat lain (terutamanya dalam pengendalian peristiwa) di mana jQuery mengharapkan fungsi sebagai parameter. Fungsi sedemikian sering dirujuk sebagai fungsi panggil balik kerana ia dipanggil selepas beberapa jenis kejadian telah berlaku.Anda juga melihat fungsi panggil balik yang bertindak balas terhadap peristiwa papan kekunci, gerakan mouse, dan penyelesaian permintaan AJAX.
Alternatif untuk dokumen. siap
Anda kadang-kadang melihat beberapa jalan pintas kerana sangat umum untuk menjalankan kod inisialisasi. Anda boleh memendekkan
$ (dokumen). siap (changeMe);
ke kod berikut:
$ (changeMe);
Jika kod ini tidak ditakrifkan di dalam fungsi dan changeMe adalah fungsi yang ditakrifkan pada halaman, jQuery secara automatik menjalankan fungsi secara langsung seperti dokumen. pendekatan yang sedia ada.
Anda juga boleh membuat fungsi tanpa nama terus:
$ (dokumen). siap (function () {$ ("# output"). html ("Saya telah berubah");});
Kaedah ini (fungsi tanpa nama) adalah rumit, tetapi anda sering melihat kod jQuery menggunakan teknik ini. Anda boleh membuat fungsi yang dinamakan init () dan memanggilnya dengan baris seperti ini:
$ (init);
Teknik ini mudah dan mudah difahami tetapi anda mungkin menghadapi variasi lain semasa anda mengkaji kod di web.