使用原生JS實現簡單的ajax

Ajax是一種使用javascript內置對象向伺服器發送請求/接收響應的技術。它可以再頁面已經完全顯示出來之後再和伺服器進行少量的數據交互，所以可以實現局部內容的刷新。

ajax的實現，主要是靠javascript中的內置對象XMLHttpRequest。它可以向伺服器發送請求並接收伺服器的響應。

下麵給給出兩個簡單的例子：

Get方式發送請求：

         //瀏覽器端    
         var xhr = new XMLHttpRequest;
         xhr.open('get', './bb.php?id=4');
         xhr.send();
         xhr.onreadystatechange = function() {
                  if(xhr.readyState == 4 && xhr.status == 200)  //響應完成並且響應碼為200
                  alert(xhr.responseText);
         }

　　　    //伺服器端
         //example.php
         <?php
         echo '歡迎' . $_GET['id'];

POST方式發送請求：

//前端
var xhr = new XMLHttpRequest;
xhr.open('post', './example.php');
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('id=4&num=5');
xhr.onreadystatechange = function() {
         if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status ==304))  //響應完成並且響應碼為200或304
         alert(xhr.responseText);
}

//後端
//example.php
<?php
echo '歡迎'. $_POST['id'];
echo '歡迎'. $_POST['num'];