Selector pada Jquery || BLC TELKOM KLATEN


A. PENDAHULUAN

  • Pengertian
Selector adalah bagian penting pada perintah Jquery. Selector adalah perintah untuk mencari atau memilih elemen HTML. Dari hasil perintah selector kita akan mendapatkan akses kepada elemen HTML tersebut. Kita juga dapat melakukan suatu aksi kepada elemen HTML tersebut.

  • Latar belakang masalah
Belum mengerti apa itu selector pada Jqeury, Fungsi, serta cara kerjanya.

B. MAKSUD DAN TUJUAN

Memahami dan mempraktikkan selector pada Jquery dan tujuannya yaitu bisa mengatur elemen HTML dengan menggunakan Jquery.

C. BATASAN DAN RUANG LINGKUP PEKERJAAN

- Pengertian Selector jquery
- Selector Tag
- Selector id
- Selector class

D. TARGET DAN HASIL YANG DIHARAPKAN

- Dapat memahami dan mempraktikkan Selector pada jquery

E. METODE PELAKSANAAN

- Mencari referensi
- Membaca dan memahami,
- Mempraktikkannya

F. ALAT DAN BAHAN

- Laptop
- Koneksi internet
- Text Editor

G. TARGET WAKTU

08.00 - 16.00

H. TAHAPAN PELAKSANAAN

Selector adalah bagian penting pada perintah Jquery. Selector adalah perintah untuk mencari atau memilih elemen HTML. Dari hasil perintah selector kita akan mendapatkan akses kepada elemen HTML tersebut. Kita juga dapat melakukan suatu aksi kepada elemen HTML tersebut.

Selector dapat memilih elemen HTML berdasarkan atribut name, id, class, tipe elemen atau nama tag tersebut, nilai dari atribut dan lain sebagainya. Perintah selector dimulai dengan penulisan $().


- Selector Tag :
selector tag mencari elemen HTML berdasarkan jenis atau nama tag. Contoh di bawah ini mencari semua tag p (elemen paragraf).

$("p")

Contoh dibawah ini memperlihatkan ketika suatu tombol di klik maka semua tag p akan hilang.

$(document).ready(function() {
  $("button").click(function() {
   $("p").hide();
 )};
});

jalankan perintah di atas


- Selector ID
selector id mencari elemen HTML berdasarkan nilai atribut id. Contoh di bawah ini mencari tag dengan atribut id bernilai test.

$("#test")

Karena nilai atribut id adalah unik untuk setiap elemen atau tag maka selector id hanya akan dapat mencari satu elemen saja.

Contoh dibawah ini memperlihatkan ketika suatu tombol dengan atribut id bernilai test akan hilang,

$(document).ready(function(){
  $("button").click(function(){
    $("#test").hide();
  });
})

Jalankan contoh 


- Selector Class
selector class mencari elemen HTML berdasarkan nilai atribut class. Contoh di bawah ini mencari tag dengan atribut class bernilai test.

$(".test")

contoh dibawah ini memperlihatkan ketika suatu tombol di klik maka tag dengan atribut class bernilai test akan hilang.

$(document).ready(function(){
  $("button").click(function(){
    $(".test").hide();
  });
});

Jalankan contoh 


I. KESIMPULAN YANG DIDAPAT

Dengan adanya selector ini dalam jquey yaitu berfungsi sebagai pemanggilan element html yang akan di atur/dirubah.

J. REFERENSI

- https://nextgen.co.id/