Semua browser modern memiliki objek XMLHttpRequest bawaan untuk meminta data dari server.
Section Artikel
Objek XMLHttpRequest dapat digunakan untuk meminta data dari server web.
Objek XMLHttpRequest sangat diinginkan developer, karena bisa:
Sintaks JavaScript umum untuk menggunakan objek XMLHttpRequest terlihat seperti ini:
Contoh :
<!DOCTYPE html> <html> <body> <h2>Using the XMLHttpRequest Object</h2> <div id="demo"> <button type="button" >var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.responseText; } }; xhttp.open("GET", "xmlhttp_info.txt", true); xhttp.send(); } </script> </body> </html>
Baris pertama pada contoh di atas membuat objek XMLHttpRequest:
var xhttp = new XMLHttpRequest();
Properti onreadystatechange menentukan fungsi yang akan dijalankan setiap kali status objek XMLHttpRequest berubah:
xhttp.onreadystatechange = function()
Jika properti readyState adalah 4 dan properti status adalah 200, berarti responsnya sudah siap:
if (this.readyState == 4 && this.status == 200)
Properti responseText mengembalikan respons server sebagai string teks.
String teks dapat digunakan untuk memperbarui halaman web:
document.getElementById("demo").innerHTML = xhttp.responseText;
Versi lama Internet Explorer (IE5 dan IE6) tidak mendukung objek XMLHttpRequest.
Untuk menangani IE5 dan IE6, periksa apakah browser mendukung objek XMLHttpRequest, atau buat ActiveXObject:
Contoh :
<!DOCTYPE html> <html> <body> <h2>Using the XMLHttpRequest Object</h2> <div id="demo"> <button type="button" >else { // code for older browsers xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.responseText; } }; xmlhttp.open("GET", "xmlhttp_info.txt", true); xmlhttp.send(); } </script> </body> </html>