JavaScript - Menguji jQuery
Uji perpustakaan rangka kerja JavaScript - jQuery
Rujukan jQuery
Untuk menguji perpustakaan JavaScript, anda perlu merujuknya dalam halaman web anda.
Untuk merujuk perpustakaan, gunakan teg <skrip> dengan atribut srcnya ditetapkan ke URL perpustakaan:
Merujuk jQuery
<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"> ;
</skrip>
</kepala>
<badan>
</badan>
</html>
Penerangan jQuery
Fungsi jQuery utama ialah fungsi $() (fungsi jQuery). Jika anda menghantar objek DOM ke fungsi ini, ia mengembalikan objek jQuery dengan fungsi jQuery ditambahkan padanya.
jQuery membenarkan anda memilih elemen melalui pemilih CSS.
Dalam JavaScript, anda boleh menetapkan fungsi untuk mengendalikan peristiwa pemuatan tetingkap:
Cara JavaScript:
{
var obj=document.getElementById("h01");
obj.innerHTML="Hello jQuery";
}
onload=myFunction;
JQuery yang setara adalah berbeza daripada:
kaedah jQuery:
{
$("#h01").html("Hello jQuery");
}
$(document).ready(myFunction);
Dalam baris terakhir kod di atas, objek dokumen HTML DOM dihantar ke jQuery: $(document).
Apabila anda menghantar objek DOM ke jQuery, jQuery mengembalikan objek jQuery yang dibalut dalam objek HTML DOM.
Fungsi jQuery mengembalikan objek jQuery baharu, yang mana ready() ialah kaedah.
Memandangkan fungsi adalah pembolehubah dalam JavaScript, anda boleh menghantar myFunction sebagai pembolehubah kepada kaedah sedia jQuery.
![]() | jQuery mengembalikan objek jQuery, yang berbeza daripada objek DOM yang diluluskan.
|
---|
Menguji jQuery
Sila cuba contoh berikut:
Contoh
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script> <script> function myFunction(){ $("#h01").html("Hello jQuery") } $(document).ready(myFunction); </script> </head> <body> <h1 id="h01"></h1> </body> </html>
Jalankan Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Sila cuba contoh ini sekali lagi:
Instance
<!DOCTYPE html> <html> <head> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script> <script> function myFunction(){ $("#h01").attr("style","color:red").html("Hello jQuery") } $(document).ready(myFunction); </script> </head> <body> <h1 id="h01"></h1> </body> </html>
Jalankan Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Seperti yang anda lihat dalam contoh di atas, jQuery membenarkan Chaining (sintaks rantai).
Merantai ialah cara mudah untuk melaksanakan berbilang tugas pada objek yang sama.
Perlu mengetahui lebih lanjut? Laman web PHP Cina menyediakan anda dengan tutorial jQuery yang hebat.