Mari Menguasai Teknik AJAX

load data dari server langsung tanpa reload keseluruhan halaman
Sumber dan Materi diambil dari w3schools.com , hanya mungkin dengan penjelasan yang lebih lebar dan menggunakan bahasa yang lebih bisa dimengerti sama teman teman.

Syntax untuk membuat XMLHttpRequest object
variable = new XMLHttpRequest( );

Belajar dengan Contoh ,akan lebih mudah untuk dimengerti.
Learning by doing
Ok,.. let us straight to Example

Buat File Html ini di localserver anda

<!DOCTYPE html>
<html>
<head>
<title>Contoh 1</title>
</head>
<body>
<div id="demo">
<h1>The XMLHttpRequest Object</h1>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>

<script>

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();
}
</script>
</body>
</html>