Belajar JQuery : Selectors

posted in: Tutorial Pemrograman | 0

Pustaka JQuery memanfaatkan Cascading Style Sheets (CSS) selector untuk secara cepat dan mudah mengakses elemen atau kelompok elemen di Document Object Model (DOM).

Sebuah jQuery Selector adalah fungsi yang menggunakan ekspresi untuk mengetahui unsur-unsur yang cocok dari DOM berdasarkan kriteria tertentu. Setelah elemen dipilih maka kita dapat melakukan berbagai operasi pada elemen yang dipilih.

The $() factory function

jQuery selector mulai dengan tanda dolar dan tanda kurung – $ (). Fungsi $ () factory membuat tiga blok bangunan berikut saat memilih elemen dalam dokumen yang diberikan −

S.N. Selector & Description
1 Tag Name

Merupakan nama tag yang tersedia di DOM. Misalnya $ (‘p’) memilih semua paragraf <p> dalam dokumen.

2 Tag ID

Merupakan tag yang tersedia dengan ID yang diberikan dalam DOM. Misalnya $ (‘# some-id’) memilih elemen tunggal dalam dokumen yang memiliki ID dari some-id.

3 Tag Class

Merupakan tag yang tersedia dalam DOM. Misalnya $ (‘.some-class’) memilih semua elemen dalam dokumen yang memiliki kelas some-class.

 

NOTE – Fungsi factory $() adalah sinonim dari fungsi jQuery (). Jadi jika anda menggunakan library JavaScript lain di mana tanda $ konflik dengan yang lain maka Anda dapat mengganti tanda $ dengan nama jQuery dan Anda dapat menggunakan fungsi jQuery () bukan $ ().

<html>
<head>
<title>Contoh JQuery</title>
<script type = "text/javascript"
src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<script type = "text/javascript" language = "javascript">
$(document).ready(function() {
$("p").css("background-color", "yellow");
});
</script>
</head>

<body>
<div>
<p class = "myclass">This is a paragraph.</p>
<p id = "myid">This is second paragraph.</p>
<p>This is third paragraph.</p>
</div>
</body>
</html>

Leave a Reply