最基本的Ajax簡述

一個html頁面,向其中添加一個<script></script>以及頁面上一個按鈕，連個文本框，内容如下：

<script type="text/javascript" language="javascript">

        var xmlHttp = false;

        try

        {

            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");

        }

        catch(e)

            try

            {

                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

            }

            catch (e2)

                xmlHttp = false;

        if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {

            xmlHttp = new XMLHttpRequest();

        /*以上經過多次的try...catch主要是不同的浏覽器中建立XMLHttpRequest對象的方法不同，

            是以要通過"試"的方法找到适合浏覽器的方法*/

        function callServer() {

            var name = document.getElementById("txtSend").value;

            var url = "Default.aspx?msg=" + escape(name);

            xmlHttp.open("GET", url, true);//true為異步資料發送

            xmlHttp.onreadystatechange = showMessage;

            xmlHttp.send(null);

        function showMessage() {

            if (xmlHttp.readyState == 4) {

                var response = xmlHttp.responseText;

                document.getElementById("txtShow").value = response;

    </script>

    ...

   <p>

        <input id="btnSubmit" type="button" value="Ajax按鈕" onclick="callServer()"/>

        <input id="txtSend" type="text" />

        <input id="txtShow" type="text" />

    </p>

 Default.aspx.cs

      ...

       Response.Write("Ajax發送過來的資料是:"+Request["msg"]);

        Response.End();

程式解釋：

   （1）、xmlHttp.open("GET",url,true)方法是XMLHttpRequest對象的方法，它有三個參數:

                   第一個參數表示通過什麼方式通路url所指定的資源，主要有兩種"GET”和"POST”;

                   第二個參數表示所通路的url位址;

                   第三個參數表示調用方式，true為異步調用，false為同步調用;

            異步調用是ajax的關鍵，open方法通路url資源是，需要一定的時間，但系統并不會等待open方法執行完畢後再繼續向下執行。  也  就是說，當open方法在通路url資源的時候，浏覽器并不是一直處于“等待”狀态，使用者依然可以在浏覽器上執行其他javascript程式。

  （2）、由于是異步調用，是以使用者并不知道open方法什麼時候才能将url資源内容擷取完畢，是以對于異步方法，通常使用觸發事件來通知使用者程式。

            onreadystatechange就是通知使用者open方法已經将url資源内容擷取完畢了的觸發事件；在此程式代碼中，程式觸發的事件函數是showMessage()；

  （3）、在showMessage函數中，xmlHttp.readyState==4表示XMLHttpRequest對象目前的狀态，隻有狀态為4時，才可以擷取到伺服器Response（應答）回來的内容。

   （4）、responseText是XMLHttpRequest對象的一個屬性，記錄着此次Web請求所回報的文本内容，這裡簡單使用了responseText屬性。

         Ajax中常用的是responseXML屬性，要求url資源傳回的是一個XML的文檔流結構，在網頁DOM中對XML文檔有多種預設的處理方式，javascript中也有用于XML處理的對象，可以友善程式的後期處理。