Bagian 4. Menggunakan Selector JQuery

Jquery selector memungkinkan seorang web designer untuk dapat menyeleksi dan memanipulasi elemen HTML. Jquery selector itu biasanya digunakan untuk mencari atau menyeleksi elemen-elemen HTML yang sudah anda definisikan, misalkan mencari id elementya, class-nya, type-nya, attributes, dan banyak lagi. Yang jelas Anda bisa mengkostumisasi proses pencarian dan manipulasi elemen HTML ini.

Baca Juga

Semua selector dalam jquery di awalin dengan tanda ini $( )Sebagai contohnya saya sudah mempersiapkan sebuah dokumen HTML bagian ke 4




<!DOCTYPE html>
<html>
<head>
<title>JQuery</title>
</head>
<body>
<h1 id="title-article">Latihan JQuery Bagian 4</h1>
<em class="author">Oleh : Loka Dwiartara</em>
<p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
<button>Klik Saya</button>
</body>
</html>

Setelah itu saya meload (memasukkan) javascript library ke dalam halaman HTML, dan mempersiapkannya untuk bisa langsung digunakan




<!DOCTYPE html>
<html>
<head>
<title>JQuery</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(function(){
});
</script>
</head>
<body>
<h1 id="title-article">Latihan JQuery Bagian 4</h1>
<em class="author">Oleh : Loka Dwiartara</em>
<p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
<button>Klik Saya</button>
</body>
</html>

Nah, untuk penggunaan jquery selector, contohnya adalah seperti ini

Download source code latihan




<!DOCTYPE html>
<html>
<head>
<title>JQuery</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h1 id="title-article">Latihan JQuery Bagian 4</h1>
<em class="author">Oleh : Loka Dwiartara</em>
<p>Saat ini kita akan memulai mempelajari lebih dalam JQuery Library</p>
<button>Klik Saya</button>
</body>
</html>

Untuk selengkapnya silahkan download ebook Menggunakan Selector JQuery silahkan klik disini