Mudah belajar jQuery part 2

Melanjutkan tutorial artikel yang kemarin yaitu Mudah belajar jQuery part 1. Dalam pembahasan selanjutnya kita akan belajar mengenai jQuery selector yang merupakan salah satu bagian terpenting dari library jQuery.

jQuery selector memungkinkan kita untuk memilih atau memanipulasi elemen html. Digunakan untuk “menemukan” (atau memilih) elemen HTML berdasarkan nama, id, kelas, jenis, atribut, nilai atribut, dan banyak lagi lainnya. Ini didasarkan pada Selektor CSS yang ada, dan di samping itu, ia memiliki beberapa penyeleksi penyesuaian sendiri.

Semua selector pada jQuery dimulai dengan simbol $ kemudian diikuti tanda kurung ().

$()

jQuery selector

jQuery elements selector
jQuery elements selector memilih berdasarkan nama elemen html
Contohnya kita dapat memilih semua tag <br> seperti ini $(“br”). Contoh kita akan menyembunyikan semua br saat meng-klik tombol:

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

Jika tombol di klik maka tag br akan nengilang

jQuery id selector
Menggunakan atribut id untuk mencari dokumen id yang lebih spesifik. Id harus unik dalam sebuah halaman. Untuk menemukan element id didalam kurung menggunakan tanda padar # contohnya seperti berikut:

$("#id-elemen"). hide()

Jika id elemen ada 2 maka hanya id elemen pertama yang akan hilang

jQuery class selector
Menggunakan atribut class untuk mencari semua elemen kelas ini artinya elemen class yang dipilih akan berpengaruh semuanya terhadap tag html yang mempunyai class bersangkutan. Untuk memilih element class menggunakan tanda titik contohnya seperti berikut:

$(".c-elemen").hide()

Element class c-elemen akan menghilang semuanya

$(this) selector
Menggunakan selector $(this) untuk mengacu kepada dirinya sendiri atau elemen yang bersangkutan. Contohnya saat kita mengetik kita dapat mengambil isi nilai dari ketikan tersebut.

Related posts

Leave a Comment