pemilih jQuery
Apakah pemilih jQuery?
Pemilih jQuery ialah salah satu bahagian yang sangat penting dalam perpustakaan jQuery. Ia menyokong sintaks CSS yang terkenal dengan pembangun web untuk menyediakan halaman dengan cepat dan mudah. Memahami pemilih jQuery adalah kunci untuk membuka pintu kepada pembangunan jQuery yang cekap. Borang sintaks pemilih jQuery biasa:
$(selector).methodName();
pemilih ialah ungkapan rentetan yang digunakan untuk mengenal pasti elemen dalam DOM dan kemudiannya disediakan menggunakan set jQuery bagi kaedah.
Dalam kebanyakan kes jQuery menyokong operasi sedemikian:
$(selector).method1().method2().method3();
Contoh ini mewakili id ??dalam DOM tersirat = elemen "goAway", dan kemudian tambahkan atribut class="inkognito" padanya.
$('#goAway').hide().addClass('inkognito');
Petua: Apabila ungkapan pemilih sepadan dengan berbilang elemen, ia boleh digunakan dengan mudah dan fleksibel seperti operasi tatasusunan JavaScript Penunjuk tatasusunan untuk pemilihan . Ini ialah contoh:
elemen var = $('img')[0]; Antara elemen yang diwakili oleh ungkapan padanan
, objek elemen pertama akan diberikan kepada elemen pembolehubah.
Pemilih Asas
1.Pemilih Elemen
Pemilih elemen jQuery adalah berdasarkan elemen. nama elemen yang dipilih.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>標(biāo)題</h2>
<p>段落。</p>
<p>另一個段落。</p>
<button>點(diǎn)擊隱藏P標(biāo)簽內(nèi)容</button>
</body>
</html>2. #id pemilih
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
});
</script>
</head>
<body>
<p>段落</p>
<p id="test">另一個段落</p>
<button>點(diǎn)擊隱藏id</button>
</body>
</html>3 >4.pemilih elemen
Tetapkan saiz teks elemen p kepada 12px:
$(document).ready(function () {
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ???????????????????????????????????????????????????? ? ? ? ? ? ? ? ? ? ?, '12px');
});
5. * Pemilih
$(dokumen ).sedia(fungsi () {
? ? ? ? ??????????????????????????????????????????????????????????????????????????????> });
$(dokumen).siap(fungsi () { // Tetapkan jidar unsur p dan unsur div kepada 0 $('p, div').css('margin', '0');
});
Gunakan fungsi jQuery dalam fail berasingan
Jika tapak web anda mengandungi banyak halaman dan anda mahu fungsi jQuery anda mudah diselenggara, kemudian letakkan fungsi jQuery anda ke dalam fail .js yang berasingan .
Apabila kami menunjukkan jQuery dalam tutorial, kami menambah fungsi terus ke bahagian <head> Walau bagaimanapun, adalah lebih baik untuk meletakkannya dalam fail berasingan, seperti ini (merujuk fail melalui atribut src):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$(".test").hide();
});
});
</script>
</head>
<body>
<h2 class="test">標(biāo)題</h2>
<p class="test">段落。</p>
<button>點(diǎn)擊隱藏所有class</button>
</body>
</html>
