AJAX adalah mimpi pengembang, karena Anda dapat:
- Memperbarui halaman web tanpa reload halaman
- Permintaan data dari server - setelah halaman telah dimuat
- Menerima data dari server - setelah halaman telah dimuat
- Mengirim data ke server - di latar belakang
Coba Sendiri Contoh di Setiap Bab
Dalam setiap bab, Anda dapat mengedit contoh online, dan klik pada tombol untuk melihat hasilnya.
AJAX Contoh Dijelaskan
HTML Halaman
<!DOCTYPE html>
<html>
<body>
<div id="demo">
<h2>Let AJAX change this text</h2>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>
</body>
</html>
Halaman HTML berisi <div> bagian dan <button> .
The <div> bagian digunakan untuk menampilkan informasi dari server.
The <button> panggilan fungsi (jika diklik).
fungsi permintaan data dari web server dan menampilkannya:
Fungsi loadDoc()
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML = this.responseText;
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
}
Apa yang Harus Anda Sudah Tahu
Sebelum Anda melanjutkan Anda harus memiliki pemahaman dasar sebagai berikut:
- HTML
- JavaScript
Jika Anda ingin mempelajari mata pelajaran ini pertama, cari tutorial di kami halaman Depan .
Apa AJAX ?
AJAX = Asynchronous JavaScript dan XML.
AJAX adalah nama menyesatkan. aplikasi AJAX mungkin menggunakan XML untuk mengangkut data, tetapi sama umum untuk mengangkut data sebagai teks biasa atau teks JSON.
AJAX adalah teknik untuk membuat halaman web yang cepat dan dinamis.
AJAX memungkinkan halaman web diperbarui asynchronously dengan bertukar data dalam jumlah kecil dengan server di belakang layar. Ini berarti bahwa adalah mungkin untuk memperbarui bagian dari halaman web, tanpa reload seluruh halaman.
halaman web klasik, (yang tidak menggunakan AJAX) harus reload seluruh halaman jika konten harus berubah.
Contoh aplikasi menggunakan AJAX: Google Maps, Gmail, YouTube, dan Facebook.
Bagaimana AJAX Pekerjaan
AJAX Berdasarkan Standar Internet
AJAX adalah berdasarkan standar internet, dan menggunakan kombinasi:
- XMLHttpRequest objek (untuk mengambil data dari web server)
- JavaScript/DOM (untuk menampilkan / menggunakan data)
XMLHttpRequest adalah nama menyesatkan. Anda tidak harus memahami XML untuk menggunakan AJAX.
Google Suggest
AJAX dipopulerkan pada tahun 2005 oleh Google, dengan Google Suggest.
Google Suggest menggunakan AJAX untuk membuat antarmuka web yang sangat dinamis: Ketika Anda mulai mengetik di kotak pencarian Google, sebuah JavaScript mengirimkan surat ke server dan server mengembalikan daftar saran.
Mulai Menggunakan AJAX Hari ini
AJAX didasarkan pada standar yang ada. Standar-standar ini telah digunakan oleh pengembang selama beberapa tahun. Baca bab berikutnya untuk melihat cara kerjanya!