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

<!DOCTYPE html> ;
<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:

function myFunction()
{
var obj=document.getElementById("h01");
obj.innerHTML="Hello jQuery";
}
onload=myFunction;

JQuery yang setara adalah berbeza daripada:

kaedah jQuery:

fungsi myFunction()
{
$("#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.

lampjQuery mengembalikan objek jQuery, yang berbeza daripada objek DOM yang diluluskan.
lampjQuery 返回 jQuery 对象，与已传递的 DOM 对象不同。
jQuery 对象拥有的属性和方法，与 DOM 对象的不同。
您不能在 jQuery 对象上使用 HTML DOM 的属性和方法。
Objek jQuery mempunyai sifat dan kaedah yang berbeza daripada objek DOM. <🎜>Anda tidak boleh menggunakan sifat dan kaedah HTML DOM pada objek jQuery.

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.