JQUERY
A. Sejarah JQuery
Pertama kali dibuat oleh John Resign pada tahun 2005, JQuery sendiri pertama kalinya dirilis pada tangga 14 januari 2006. Versi terbaru dari JQuery yaitu versi 1.3.2. Jqueri dibuat terinspirasi dari Behavior code. Menurut pembuatnya hasil dari behavior code tersebut dirasa kurang elegan dan masih belom sempurna, maka dia mengembangkannya dengan JQuery. Dimana penulisan codenya menjadi lebih simple, gampang dan tentunya dengan hasil yang memuaskan.
John Resig merupakan otak dibalik jQuery, karyanya ini pertama kali diumumkan di NYC BarCamp pada awal tahun 2006. Di situs webnya dia mencatat, ia menciptakan jQuery karena ia tidak puas dengan library yang saat itu tersedia dan merasa bahwa seharusnya framework-framework tersebut bias jauh lebih baik dengan mengurangi “syntactic fluff” dan menambahkan control khusus untuk tindakan-tindakan yang bersifat umum.
Kemudian para pengembang datang untuk membantu menyempurnakan library ini, dan akhirnya menghasilkan rilis stabil pertama dari jQueryversi 1.0 padatanggal 2006. Sejakitu, jQuery telah berkembang ke versi 1.7.1 dan telah mempunyai plug-in yang banyak. Sebuah plug-in adalah ekstensi dari jQuery yang bukan bagian dari library inti.
B. Pengertian JQuery
JQuery adalah javascript library, jQuery mempunyai semboyan “write less, do more”. jQuery dirancang untuk memperingkas kode-kode javascript. JQuery adalah javascript library yang cepat dan ringan untuk menangani dokumen HTML, menangani event, membuat animasi dan interakasi ajax. JQuery dirancang untuk mengubah cara anda menulis javascript.
JQuery adalah library Javascript yang dibuat untuk memudahkan pembuatan website dengan HTML yang berjalan di sisi Client. Script JQuery dibuat untuk memudahkan pengaturan document seperti menyeleksi object dengan element DOM dan membuat aplikasi dengan AJAX. Jquery juga menyediakan layanan atau support para developers untuk membuat plug-ins di dalam bahasa Javascript tentunya. Sehingga memungkinkan para developer website membuat website lebih interaktif dengan animasi, efek – efek, tema dan widget. Dengan menggunakan JQuery kita bisa meluapkan kreatifitas untuk membuat website dinamis atau website aplikasi menjadi Powerfull.
Dengan JQuery, suatu halaman web yang menjadi aplikasi web, jika dilihat sourcenya, akan terlihat seperti dokumen HTML biasa; tidak ada kode JavaScript yang terlihat langsung. Teknik pemrograman web seperti ini disebut sebagai unobstrusive JavaScript programming.
Script JQuery dibuat untuk memudahkan pengaturan document seperti menyeleksi object dengan element DOM dan membuat aplikasi dengan AJAX. Jquery juga menyediakan layanan atau support para developers untuk membuat plug-ins di dalam bahasa Java script tentunya. Sehingga memungkinkan para developer website membuat website lebihinteraktifdengananimasi, efek – efek, temadan widget.
JQuery dikembangkan pertama kali oleh John Resig, yang dibuat lebih ramping dari librari Prototype yang menjadi inspirasi dari libarari JQuery ini. Secara pemrograman, JQuery memiliki kemiripan seperti Prototype.
C. Tujuan Pembuatan JQuery
JQuery merupakan kumpulan JavaScript yang dikemas sedemikian rupa sehingga bisa digunakan untuk manipulasi komponen di dokumen HTML, menangani event, animasi, efek, dan melakukan request ke server menggunakan AJAX. Tujuan dari pembuatan jQuery ini hanya satu, yaitu membuat penggunaan JavaScript menjadi relatif sangat mudah. Sesuai dengan slogan dari jQuery itu sendiri yaitu “Write Less Do More...”.
Dengan adanya jQuery yang mempermudah dalam pembuatan Web Apps yang lebih interaktif dan tentunya Cantik. Ditambah lagi dengan adanya berbagai macam Plugin dari jQuery yang tentunya akan menambahkan kemudahan yang mungkin sebelumnya hanya bisa menjadi khayalan dalam pengembangan aplikasi web.
D. Fungsi JQuery
1. Mengakses bagian halaman tertentu dengan mudah.
2. Mengubah tampilan bagian halaman tertentu.
3. Mengubah isi dari halaman.
4. Merespond interaksi user dalam halaman.
5. Menambahkan animasi ke halaman.
6. Mengambil informasi dari server tanpa me-refresh seluruh halaman.
7. Menyederhanakan penulisan Javascript biasa.
E. Kemampuan JQuery
1. Kemudahan mengakses elemen-elemen HTML
2. Memanipulasi elemen HTML
3. Memanipulasi CSS
4. Penanganan event HTML
5. Efek-efek javascript dan animasi
6. Modifikasi HTML DOM
7. Menyederhanakan kode javascript lainnya
F. CARA KERJA JQUERY
Cara kerja jQuery dapat dijabarkan sebagai berikut:
1. JQuery akan memastikan bahwa semua elemen atau elemen yang diinginkan sudah ditampilkan semua di halaman web, fungsi yang digunakanadalah:
$(document).ready(function(){
//baris kode jQuery akan dijalankan
// apabilasemua elemen sudah ditampilkan semua
});
2. Setelah semua elemen ditampilkan, tahap berikutnya adalah memilih elemen berdasarkan class atau id yang telah didefinisikan. Dalam hal ini, jQuery
menggunakan fungsi Selector.
$("#foto")
$(".sembunyi")
$(".tampil")
3. Setelah elemen dipilih, tahap berikutnya adalah memberikan aksi/ operasi terhadap elemen yang sudah dipilih. Misalnya tombol yang akan menyembunyikan dan memunculkan kembali gambar.
$(".sembunyi").click(function(){
$("#foto").hide("slow");
)};
G. Syntak JQuery
Sintaks jquery biasanya dibuat untuk memilih elemen-elemen HTML dan melakukan aksi terhadap elemen yang dipilih.
Sintaks:
$(selector).action()
Tanda dollar, untuk mendefinisikan jQuery
(selector), untuk menunjukkan elemen yang dipilih atau dituju
action(), adalah jQuery action yang akan dilakukan terhadap elemen yang dipilih
Contoh :
$(this).hide()
– menyembunyikan elemen saat ini
$("p").hide()
– menyembunyikan semua paragraf atau konten dari tag <p>
$(".test").hide()
– menyembunyikan elemen yang mempunya class=”test”
$("#test").show()
H. Apa Yang BIisa Dilakukan Dengan JQuery?
a. Mengakses bagian halaman tertentu dengan mudah.
Tanpa adanya library Javascript khusus, untuk mengakses suatu bagian tertentu dari halaman, harus mengikuti aturan Document Object Model (DOM) dan pengaksesan harus secara spesifik menyesuaikan dengan struktur HTML. Dengan kata lain, pengaksesan bagian tertentu dari halaman sangat tergantung pada struktur dari HTML. JQuery menawarkan cara yang mudah (bahkan sangat mudah) dalam mengakses bagian tertentu dari halaman. Pengaksesan juga tidak terlalu bergantung pada struktur HTML.
b. Mengubah tampilan bagian halaman tertentu.
CSS (Cascading Style Sheet) menawarkan metode yang cukup handal dalam mengatur dan mempercantik halaman web. Namun terkadang CSS punya kelemahan yang cukup mengganggu, yaitu beberapa perintah CSS tidak didukung oleh semua browser. Cukup merepotkan jika kita harus mendesign halaman web dengan beberapa CSS sekaligus. Sekali lagi JQuery menawarkan solusi untuk mengatasi hal tersebut. Dengan JQuery, “kesenjangan” yang terjadi antara browser dalam urusan CSS akan tertutup dengan baik.
c. Mengubah isi dari halaman.
Jaman dulu (baca:sebelum JQuery lahir) cukup sulit jika kita akan mengubah sebagian isi dari halaman. Mengubah disini dapat berarti mengganti teks, menambahkan teks atau gambar, mengurutkan suatu daftar (list), menghapus baris tabel dan sebagainya. Dengan JQuery, hal tersebut dapat dilakukan dengan hanya beberapa baris perintah.
d. Merespond interaksi user dalam halaman.
Website yang baik tidak cukup digambarkan dengan user-interface dan tampilan yang memukau. Namun lebih dari itu, bagaimana pengunjung dapat berinteraksi dengan website dan dapat mengatur tampilannya sendiri. Interaktivitas sangat bergantung bagaimana pemrograman yang dipakai dalam menangani event-handling. Javascript sendiri memiliki beberapa event-handling seperti onclick untuk menangani event saat terjadi click. Namun demikian, event handling pada Javascript terbatas pada object-object tertentu, dan jenisnya pun terbatas. JQuery melengkapi semuanya dengan tambahan penanganan event-handling yang semakin mudah.
e. Menambahkan animasi ke halaman.
Animasi seringkali disertakan dalam suatu halaman web untuk menambah kecantikannya. Saat ini animasi masih cukup digemari oleh para peselancar situs. Animasi dapat dibuat dalam berbagai gaya, ada yang menggunakan Flash, gambar bergerak (GIF), video, dan sebagainya. Masing-masing tentu memiliki kelebihan dan kekurangan masing-masing. JQuery sendiri menawarkan konsep animasi (walaupun masih sederhana) yang cukup apik namun ramah bandwidth alias ringan. Salah satu animasi yang bisa dibuat dengan JQuery adalah fading jika terdapat suatu bagian dari halaman ditambahkan atau dihilangkan.
f. Mengambil informasi dari server tanpa me-refresh seluruh halaman.
Mengambil informasi dari server tanpa refresh halaman merupakan salah satu konsep dasar dari yang namanya AJAX (Asynchronous Javascript and XML). Pada penerapannya, cukup ribet jika harus membangun website dengan konsep AJAX, saat ini banyak library khusus yang berusaha mempermudahnya. JQuery merupakan salah satunya.
g. Menyederhanakan penulisan Javascript biasa.
Semboyan JQuery adalah “Write less, do more” atau dengan kata lain kesederhanaan dalam penulisan code, tetapi menghasilnya tampilan yang lebih. Sebenarnya inilah yang menjadi daya tarik tersendiri buat para pengembang web untuk menggunakan JQuery.
I. Fitur-Fitur Jquery
Beberapa Fitur yang ada di JQuery :
1. Dalam Pemakaian menggunakan seleksi element DOM, sehingga website lebih dinamis dan interaktif.
Document Object Mode (DOM) adalah object model standar untuk HTML dan XML yang bersifat platform independent. Sebuah web browser tidak harus menggunakan DOM untuk menampilkan dokumen HTML. Namun DOM diperlukan oleh JavaScript yang akan mengubah tampilan sebuah website secara dinamis. Dengan kata lain, DOM adalah cara JavaScript melihat suatu halaman HTML.
2. JQuery bias memanipulasi Class pada CSS dan Support CSS 3
3. Event
4. AJAX
5. Efek-efekdananimasi
6. Ekstensidan Plug-ins
7. Kompatibilitas dengan hamper semua Browser modern
8. Keperluan lain seperti : User Agent, Feature detection danlainnya
J. KELEBIHAN DAN KELEMAHAN JQUERY
Kelebihan :
1) Write Less, Do More.
2) Dengan menggunakan jQuery tentu kita telah menyederhanakan penggunaan javascript, karena kita cukup menggunakan fungsi dari library javascript yang ada.
3) Mempercepat coding javascript dalam sebuah website.
4) Dibandingkan bila kita harus mulai sebuah script javascript satu per satu dari nol.
5) Dengan menggunakan jQuery berarti kita telah meringkasnya dan membiarkan jQuery mengolahnya.
6) Fungsi pemakaian beserta contohnya bisa anda lihat di http://jquery.com untuk mempermudah dalam pembelajaran jQuery.
7) Support terhadap CSS1-3 selector, untuk fleksibilitas desain antar muka halaman website dan interaksinya.
8) Halaman website/blog yang dibangun dengan jQuery akan lebih interaktif dan menarik, membuat para pengunjung lebih terkesan.
Kelemahan
1) Walaupun klaim bahwa loading menjadi semakin ringan, web/blog yang tidak menggunakan jQuery alias HTML murni tetap lebih ringan untuk diload terutama dimata CPU dan RAM
2) Dari sisi server hosting pun, CPU dan RAM harus mengalokasikan resource yang mereka miliki untuk menangani request terhadap jQuery. Pada level tertentu request yang sangat banyak melebihi standar akan membebani server tersebut.
3) Solusi: host jquery pada situs lain, seperti Google yang menyediakan request jQuery dari servernya (API).
Refrensi
http://www.slideshare.net/hutomon/j-query-dan-penggunaannya-sebagai-validasi-form-28752968
