Dengan jQuery, anda boleh memilih (pertanyaan) elemen HTML dan melakukan "tindakan" padanya.
sintaks jQuery
Dalam atur cara jQuery, sama ada pemilihan elemen halaman atau terbina dalam fungsi, Semuanya bermula dengan tanda dolar "$", dan "$" ini ialah objek paling penting dan unik dalam jQuery: objek jQuery, jadi kita boleh menulis seperti ini apabila memilih elemen halaman atau melaksanakan fungsi:
$(function(){}); //执行一个匿名函数
$('#box'); //进行执行的ID元素选择
$('#box').css('color','red'); //执行函数功能
Memandangkan "$" itu sendiri adalah singkatan objek jQuery, iaitu, kita boleh menulis kod di atas dalam bentuk berikut:
jQuery(function(){});
jQuery('#box');
jQuery('#box').css('color','red');
Contoh
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> <script> $(function(){ $('#box').css('color','red'); }); // alert($===jQuery); </script> </head> <body> <div id="box">jQuery语法</div> </body> </html>
mod pemuatan jQuery
Kami sebelum ini Kod telah menggunakan $(function(){}); Kod ini dibungkus dari awal hingga akhir Adakah anda tahu mengapa anda melakukan ini?
Sebabnya ialah fail perpustakaan jQuery kami dimuatkan sebelum elemen badan Kami mesti menunggu semua kod halaman web dimuatkan sebelum memuatkan kod JavaScript, jika tidak, kami tidak akan dapat untuk mendapatkan
Instance
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> <script> $('#box').css('color','red'); </script> </head> <body> <div id="box">jQuery语法</div> </body> </html>
Jadi JavaScript kami yang terdahulu memberi kami:
rreeeus jQuery menyediakan kami dengan:
window.onload=function(){}; //JavaScript等待加载
Perbezaan antara keduanya:
1 Masa pelaksanaan
window.onload: Anda mesti menunggu halaman web dimuatkan (termasuk imej) sebelum melaksanakan kod pakej.
$(document).ready(function(){}): Cuma tunggu struktur DOM dalam halaman web dimuatkan sebelum melaksanakan kod yang dibalut. Kesan yang lebih tinggi
2. Bilangan pelaksanaan
window.onload hanya boleh dilaksanakan sekali Jika ia dilaksanakan untuk kali kedua, pelaksanaan pertama akan ditimpa
$(document).ready(function(){}): Tidak kira berapa kali. ia dilaksanakan, Tidak akan ditimpa
Contoh
$(document).ready(function(){}); //jQuery等待加载
<🎜 🎜>
3. Singkatan
window.onload Tiada
$(document).ready(function(){}) $(function (){});
Dalam aplikasi sebenar, kami jarang menggunakan window.onload secara langsung kerana ia perlu menunggu elemen besar seperti gambar dimuatkan sebelum melaksanakan kod JS Jika kelajuan rangkaian perlahan, , halaman telah dikembangkan sepenuhnya , dan imej masih dimuatkan dengan perlahan Pada masa ini, sebarang fungsi interaktif JS pada halaman berada dalam keadaan animasi yang digantung, seperti beberapa menu lungsur dan seumpamanya.