Belajar web : load page dengan Jquery Ajax
selamat datang di arsipbertuah pada posting satu ini saya akan membahas tentang cara membuat load halaman menggunakan jquery ajax. dengan tujuan untuk mempercepat proses loading karena semua element web tidak di load semua.
Pengertian Jquery
jQuery adalah sebuah library Javascript yang sangat ringkas dan sederhana untuk memanipulasi komponen di dokumen HTML, menangani event, animasi, efek dan memproses interaksi ajax. jQuerydirancang sedemikian rupa supaya membuat program menggunakan Javascript menjadi relatif sangat mudah. dengan jquery kita tinggal memanggil fungsi yang ada tentunya sesuai dengan dengan kasus kita untuk membuat gambar menjadi zoom .tujuannya menggunakan jquery adalah untuk mempercantik tampilan dan membuat web kita lebih interaktifpengertian Ajax
AJAX(Asynchoronous Javascript and XML) adalah sebuah teknik pemograman yang memungkinkan kita melakukan pertukaran data dengan server di belakang layar,sehingga halaman web tidak perlu di reload lagi hanya untuk menganti sebagian kecil dari isi halaman.dan jQuery adalah sebuah library Javascript yang sangat ringkas dan sederhana untuk memanipulasi komponen di dokumen HTML, menangani event, animasi, efek dan memproses interaksi ajax. jQuery dirancang sedemikian rupa supaya membuat program menggunakan Javascript menjadi relatif sangat mudah.
dengan adanya Jquery proses development ajax bisa menjadi lebih mudah.
basic dari jquery ajax sepert berikut.
load(url, params, callback);
load(url, params, callback);
 |
| belajar Jquery |
keterangan
- url(string): url dari file html yang akan di load
- params(object): data yang akan dikirim ke server
- callback(function): fungsi yang akan dijalan ketika data berhasil di load
contoh implementasi Juery ajax
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load("contoh.php");
});
});
</script>
</head>
<body>
<div id="div1"><h2>div ini akan diisi dengan hasil load jquery ajax</h2></div>
<button>load ajax</button>
</body>
</html>
silahkan dicoba gan ganti contoh.php dengan url php agan . dan pastikan pc dalam keadaan online untuk menjalankan kode diatas. karena instalasi jquerynya menggunakan CDN.
dan ketika dijalankan dibrowser. div1 akan diisi dengan hasil load php tanpa ada proses loading di browser. itulah kelebihan dari jquery ajax. dengan jquery sangat mudah untuk membuat proses ajax karena sintak yang digunakan lebih simple dari pada ajax yang menggunakan javascript lansung.
dan ketika dijalankan dibrowser. div1 akan diisi dengan hasil load php tanpa ada proses loading di browser. itulah kelebihan dari jquery ajax. dengan jquery sangat mudah untuk membuat proses ajax karena sintak yang digunakan lebih simple dari pada ajax yang menggunakan javascript lansung.
referensi:Buku Pintar WEBMASTER
Comments
Post a Comment
-Berkomentarlah yang baik dan rapi.
-Menggunakan link aktif akan dihapus.