jQuery merupakan Perpustakaan JavaScript untuk menyederhanakan pemrograman JavaScript sehingga akan lebih mudah menggunakan JavaScript dalam pembuatan aplikasi berbasis web, sesuai dengan slogannya “write less, do more”, menjadikan sedikit menulis kode tapi banyak hal yang bisa dilakukan, selain itu kelebihan lainnya jQuery itu ringan. Akan tetapi, pastikan sebelum belajar jQuery, terlebih dahulu harus memiliki pengetahuan dasar tentang: HTML, CSS, dan JavaScript.
jQuery membutuhkan banyak tugas umum yang memerlukan banyak baris kode JavaScript untuk diselesaikan, dan membungkusnya menjadi metode yang dapat dipanggil dengan satu baris kode. Juga menyederhanakan banyak hal rumit dari JavaScript, seperti panggilan AJAX dan manipulasi DOM. Perpustakaan ini berisi beberapa fitur berikut: Manipulasi HTML / DOM, Manipulasi CSS, Metode even HTML, Efek dan animasi, AJAX, dan Utilitas. Selain itu di internet banyak plugin jQuery untuk fungsi tertentu yang siap digunakan.
Walaupun banyak frameworks JavaScript, tapi tampaknya jQuery yang paling populer dan juga yang paling banyak digunakan, seperti banyak web perusahaan besar menggunakannya. Kelebihan lainnya, mengetahui semua masalah lintas-browser, dan mereka telah menulis pengetahuan ini ke dalam perpustakaan tersendiri. Sehingga akan berjalan persis sama di semua browser utama, termasuk Internet Explorer 6!
Ada beberapa cara untuk mulai menggunakan jQuery di project aplikasi web, pertama mownload dari jQuery.com, tempatkan di folder aplikasi yang dibangun lalu diakses secara lokal menggunakan url relative. Kedua dengan memanggil url dari CDN, seperti Google. Ada dua versi yang tersedia untuk didownload: Production version – ini untuk situs web live Anda karena telah diminimalkan dan dikompresi. Development version – ini untuk pengujian dan pengembangan (kode yang tidak dikompres dan dapat dibaca).
Perpustakaan jQuery adalah file JavaScript tunggal, dan dipanggil dengan tag <script> HTML (perhatikan bahwa tag <script> seharusnya ada di dalam bagian <head>): Contoh: <script src = “jquery-3.2.1.min.js”> </ script>. Tempatkan file yang didownload dalam direktori yang sama dengan halaman di mana Anda ingin menggunakannya.
Jika Anda tidak ingin mendownload dan meng-host sendiri, Anda dapat memasukkannya dari CDN (Content Delivery Network). Contoh: <script src = “https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js”> </ script>. Banyak pengguna sudah mendownload dari Google atau Microsoft saat mengunjungi situs lain. Akibatnya, akan diambil dari cache saat mereka mengunjungi situs Anda, yang menyebabkan waktu loading lebih cepat. Selain itu, sebagian besar CDN akan memastikan bahwa begitu pengguna meminta file dari situ, server tersebut akan dilayani dari server yang terdekat dengan mereka, yang juga menyebabkan waktu loading lebih cepat.
Contoh:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<p>Jika Anda klik, akan menghilang.</p>
<p>Klik di sini!</p>
<p>Klik di sini!</p>
</body>
</html>
Demikian tutorial ini, semoga bermanfaat.