Cara Mengincludekan JQuery Dalam Halaman Web
Judulnya kok aneh ya? Hehe, ga nemu kata yang cocok sih, yaudahlah pake kata include aja gapapa kan 
Untuk menggunakan jQuery dalam sebuah halaman web, library JQuery perlu dimuat terlebih dahulu dalam dokumen HTML kita, untuk memberikan akses ke fungsi-fungsi jQuery. Jika library tidak dimuat saat halaman loading pertama kali, script yang menggunakan sintaks jQuery kemungkinan tidak akan berjalan. Untungnya, untuk proses loading jQuery sangat sederhana, dan ada beberapa pilihan cara yang tersedia untuk melakukannya.
Mengincludekan jQuery yang sudah didownload
Opsi pertama untuk mengincludekan jQuery dalam sebuah halam web adalah dengan cara menyimpan hasil download jQuery dalam file yang kita gunakan. Adapun struktur dan cara memasukkannya sama seperti file JavaScript lainnya:
<script src="js/jquery-1.4.2.min.js"></script>
Remote Hosted jQuery
Pilihan kedua adalah untuk menggunakan salinan jQuery yang disimpan di hosting Google Code. Kelebihan cara ini adalah pengunjung web kita akan memakai salinan jQuery yang paling baru yang di cache dari web lain dengan versi yang sama. Hal ini dapat dengan signifikan mengurangi waktu load bagi pengguna situs kita. Caranya seperti cara pertama, hanya saja src di arahkan ke server Google Code seperti berikut ini:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
Menggunakan Google AJAX API Libraries
Google Code juga menawarkan pilihan untuk versi jQuery yag diberi nama AJAX API Libraries (lihat http://code.google.com/apis/ajaxlibs). Menurut definisi dari website resmi Google, “The AJAX Libraries API is a content
distribution network and loading architecture for the most popular, open source JavaScript libraries.”
Menggunakan AJAX API Libraries untuk sumber kode jQuery sangat sederhana dan mudah, dan inilah metode yang akan digunakan pada tutorial di blog ini. Untuk menggunakan jQuery dari AJAX API Libraries , gunakan potongan perintah berikut :
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.4.2");</script>
Menyiapkan File Untuk Pengujian
Sekarang seluruh lingkungan pengujian Anda sudah diatur, jika belum baca dulu postingan ini. Buat folder baru dalam folder htdocs XAMPP Anda, lalu beri nama folder tersebut sesuai keinginan Anda, dalam tutorial ini saya menamakannya ‘latihan’. Didalam folder latihan tersebut, buatlah sebuah file html dengan nama index.html. Gunakan text editor favorit Anda, lalu isikan file berikut ini:
<!DOCTYPE html>
<html>
<head>
<title>Testing jQuery</title>
</head>
<body>
<p>Hello World!</p>
<p>Another paragraph, but this one has a class.</p>
<p><span>This is a span inside a paragraph.</span></p>
<p id="bar">Paragraph with an id.
<span>And this sentence is in a span.</span>
</p>
<script type="text/javascript"
src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.4.2");
</script>
</body>
</html>
Perhatikan: Loading script JavaScript diletakkan sebelum tag body penutup (</ body>) dilakukan untuk menjaga script dari kemungkinan memblokir elemen halaman lainnya, seperti foto, gambar, dll. Hal ini juga mencegah JavaScript menjalankan fungsinya sebelum semua elemen sepenuhnya dimuat pada halaman. Hal tersebut yang dapat mengakibatkan perilaku yang tidak diharapkan atau kesalahan pada JavaScript kita.
Simpan dan buka halaman http://localhost/latihan/ pada Firefox (lihat gambar).
Source: setoelkahfi.web.id
