Memahami Selector Jquery
- Selector jQuery yaitu script yang digunakan untuk menentukan suatu elemen HTML yang akan dimanipulasi dengan jQuery.
Selector jQuery ditulis didalam kurung sehabis tanda dolar ($).
Belajar JQuery: Selector jQuery
Format penulisan Selector jQuery yaitu sebagai berikut:
$('selector')
Contoh penulisan selector jQuery didalam program:
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> <script> $(document).ready(function(){ $("p").css({"background-color": "yellow", "font-size": "200%"}); }); </script> </head> <body> <p style="background-color:red;"> Belajar JQUERY bersama www.</p> </body> </html> Hasil browser, latihan selector jquery:
Penjelasan:
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"> : yaitu file jquery yang harus dipanggil/load terlebih dahulu.
- $("p") : merupakan selector jquery dengan tag <p>.
- .css({"background-color": "yellow", "font-size": "200%"}); : merupakan manipulasi terhadap CSS, untuk merubah nilai yang sudah diterapkan.
- Hasil browser menampilkan bahwa background-color: yellow/kuning, walaupun style sheet di tag <p> yaitu red/merah, alasannya yaitu maipulasi dari "selector jquery".
Seperti itulah kerja daripada jQuery. Bisa memanipulasi atau menambahkan kode-kode HTML/CSS.
Ada banyak Selector jQuery. Namun, akan aku berikan yang biasa digunakan saja.
Yukkk eksklusif saja mencar ilmu Selector jQuery nya :).
Selector tag: yang artinya digunakan untuk menentukan tag HTML dengan cara menuliskan nama tag nya langusung. Misalnya menentukan tag <p> maka ditulisnya menjadi: $('p').
Selector class: yang artinya digunakan untuk menentukan tag HTML yang mempunyai atribut class tertentu. Cara penulisannya dengan menaruh tanda titik (.) sebelum nama class, contohnya menentukan tag <p class="merah"> maka penulisan selector menjadi: $('.merah') atau ('p.merah').
Selector id: yang artinya digunakan untuk menentukan tag HTML yang mempunyai atribut id tertentu. Cara penulisannya dengan menaruh tanda pagar (#) sebelum nama id. Misalnya menentukan tag <p id="hijau"> maka penulisan selector menjadi: $('#hijau').
:first: digunakan untuk menentukan elemen yang disebutkan sebelumnya pada urutan yang petama. Misalnya menentukan tag <p> yang pertama, maksudnya yang pertama, sehabis selector <p> ada satu atau lebih selector <p> yang lain , maka penulisannya menjadi $('p:first').
:last: digunakan untuk menentukan tag HTML yang disebutkan sebelumnya pada urutan yang terakhir, ini kebalikannya dengan selector :first, contohnya menentukan tag <p> yang terakhir, maka penulisannya menjadi $('p:last').
:even: digunakan untuk menentukan tag HTML yang disebutkan sebelumnya pada urutan ganjil. Misalnya menentukan tag <p> yang ke tiga, lima dst, penulisannya $('p:even').
:old: digunakan untuk menentukan tag HTML yang disebutkan sebelumnya pada urutan genap. Kebalikan dari selector even.
:checked: digunakan untuk memilih checkbox yang sedang dicentang.
:hidden: digunakan umtuk menentukan tag HTML yang sedang disembunyikan (hidden).
not(selector): digunakan untuk menentukan tag HTML yang tidak dipilih oleh selector yang terletak didalam kurung. Misalnya menentukan tag <p> yang tidak mempunyai class "merah" , maka penulisannya: $('p:not(.merah)').
Selanjutnya dapat mencar ilmu Memahami Effect dalam jQuery.
Tentunya masih banyak selector-selector yang lain yang dapat dipelajari lagi disitus resminya (www.jquery[dot]com). Semoga bermanfaat artikel Memahami Selector jQuery.
- salam -