<dd id="y7hvi"><strong id="y7hvi"></strong></dd>
<output id="y7hvi"><pre id="y7hvi"></pre></output>
    <label id="y7hvi"></label>
    <small id="y7hvi"><menu id="y7hvi"><del id="y7hvi"></del></menu></small><listing id="y7hvi"><menu id="y7hvi"><s id="y7hvi"></s></menu></listing>
    <label id="y7hvi"><button id="y7hvi"></button></label><small id="y7hvi"></small>

    <listing id="y7hvi"></listing>
      您的位置 >>> 星想互聯 >>> 課堂教學 >>> 試卷成績
      ajax入門
      點擊數:582  發布時間2020-03-23 17:08:53

      Ajax 全稱是 asynchronous javascript and xml,并不是新的編程語言,可以說是已有技術的組合,主要用來實現客戶端與服務器端的異步通信效果,實現頁面的局部刷新,從而創建快速動態網頁的技術。


      l Ajax過程

      - 創建xhrRequest對象,也就是創建一個異步調用對象

      - 創建一個新的HTTP請求,并指定其請求的方法、URL及驗證信息

      - 設置響應 HTTP 請求狀態變化的函數

      - 發送 HTTP 請求

      - 獲取異步調用返回的數據

      - 使用 JavaScript DOM 實現局部刷新


      l 創建xhrRequest 對象

      xhrRequest 用于在后臺與服務器交換數據。這意味著可以在不重新加載整個網頁的情況下,對網頁的某部分進行更新。

      在使用ajax之前 ,首先要通過xhrRequest構造函數創建ajax對象

      創建 xhrRequest 對象的語法:

      xhr=new xhrRequest();


      老版本的 Internet Explorer IE5 IE6)使用 ActiveX 對象:

      xhr=new ActiveXObject("Microsoft.xhr");


      l Ajax向服務器發送請求:

      Ajax對象創建完成后,就可以向服務器發送請求,我們使用 xhrRequest 對象的 open() send() 方法:

      GET 請求:

      xhr.open("GET","show.php?fname=Bill&lname=Gates",true);

      xhr.send();


      POST 請求:

      xhr.open("POST","show.php",true);

      xhr.send();


      POST 表單請求:

      如果需要像 HTML 表單那樣 POST 數據,請使用 setRequestHeader() 來添加 HTTP 頭。然后在 send() 方法中規定您希望發送的數據:

      xhr.open("POST","show.php",true);

      xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");

      xhr.send("fname=Bill&lname=Gates");


      l 處理務器返回的信息:

      Ajax向服務器發送請求后,會等待服務器返回響應信息,然后對響應結果進行處理,下面將對Ajax如何處理服務器返回的信息進行詳細分析:

      ① readyState屬性

      readyState屬性用于獲取當前Ajax狀態,從 0 4有五種形式。

      0: 請求未初始化

      1: 服務器連接已建立

      2: 請求已接收

      3: 請求處理中

      4: 請求已完成,且響應已就緒


      ② onreadystatechange 事件

      onreadystatechange 事件用于感知readyState屬性狀態的改變,每當 readyState 屬性改變時,就會調用該函數。下面是一個例子:



      ③ status屬性

      status屬性用于返回當前請求的http狀態碼,值為數值類型,如,當請求 成功時,狀態碼為200;


      ④ 服務器響應

      當請求成功且數據接收完成時,可使用Ajax對象提供的 responseText responseXML 屬性得到來自服 務器的響應。如:

      document.getElementById("myDiv").innerHTML=xhr.responseText;


      【案例】AJAX請求

      下面是一個完整的AJAX請求的案例:

      <script>

          var xhr = new XMLHttpRequest();

          xhr.onreadystatechange = function() {


              }

          };

          xhr.open('GET', 'show.php');

          xhr.send();

      </script>


      來源:咸寧網站建設
      【上一篇】ajax請求頭設置
      【下一篇】laravel 服務容器的用法
      新天线宝宝