根據Ajax與XMLHttpRequest對象一文的介紹，我們可以開發一個簡單的Ajax框架供以后開發應用。
首先要知道Ajax的開發流程：
1：初始化XMLHttpRequest,這一步要考慮跨瀏覽器的問題。
2：設置XMLHttpRequest對象的onReadyStateChange屬性，指定服務器返回響應數據時要調用的回調函數，即指定響應處理函數，
3：調用XMLHttpRequest對象的open方法，創建http請求。
4：調用XMLHttpRequest對象的setResouceHeader等方法，設置必要的http請求頭信息。
5：調用XMLHttpRequest對象的send方法，發送之前創建的http請求。
6：根據XMLHttpRequest對象的open方法參數，決定等待或者不等待服務器回響應數據。如果服務器返回響應數據，則將控制權交給之前設置回調函數。

了解上面的流程后，我們來一步步的解析和示范，形成一個發送和接收XMLHttpRequest請求的Ajax應用程序框架。 //定義XMLHttpRequest對象實例
var?http_request?=?false;
//定義創建跨瀏覽器XMLHttpRequest方法
function?createXMLHttpRequest()
{
????http_request?=?false;
????//開始初始化XMLHttpRequest對象
????if(window.XMLHttpRequest)?{?//Mozilla?瀏覽器
????????http_request?=?new?XMLHttpRequest();
????????if?(http_request.overrideMimeType)?{//設置MiME類別
????????????//有些版本的瀏覽器在處理服務器返回的未包含XML?mime-type頭部信息的內容時會報錯，因此，要確保返回的內容包含text/xml信息。
????????????http_request.overrideMimeType("text/xml");
????????}
????}
????else?if?(window.ActiveXObject)?{?//?IE瀏覽器
????????try?{
????????????http_request?=?new?ActiveXObject("Msxml2.XMLHTTP");
????????}?catch?(e)?{
????????????try?{
????????????????http_request?=?new?ActiveXObject("Microsoft.XMLHTTP");
????????????}?catch?(e)?{}
????????}
????}
????if?(!http_request)?{?//?異常，創建對象實例失敗
????????window.alert("不能創建XMLHttpRequest對象實例.");
????????return?false;
????}
}
//定義可復用的http請求發送函數
function?send_request(method,url,content,callback)?{//請求方式，請求目標，內容，處理函數名稱
????
????//第一步：初始化XMLHttpRequest
????createXMLHttpRequest();
????
????//第二步：指定響應處理函數
????http_request.onreadystatechange?=?callback;//注意這里不用加括號

????//第三步：向服務器發出http請求　調用?open和send方法
????//?確定發送請求的方式和URL以及是否異步執行下段代碼
????if(method.toLowerCase()=="get")?{
????????http_request.open(method,?url,?true);//第三個參數　為　是否異步
????}
????else?if(method.toLowerCase()=="post")?{
????????http_request.open(method,?url,?true);
????????http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//這個位置不能放錯
????}
????else?{
????????window.alert("http請求類別參數錯誤。");
????????return?false;
????}

????http_request.send(content);
????//send方法如果POST方式發出的話，可以是任何想傳給服務器的內容，不過與form一樣，如果要傳的是文件或者POST內容給服務器，在調用open方法之后send方法之前，必須先調用XMLHttpRequest對象的setRequestHeader方法，修改http請求頭信息中的MIME類別。
}
????//最后一步　就是處理服務器返回信息的方法了，由于每個頁面的應用不同，所以應該將具體方法寫在相應的頁面中。這寫一個示例：
????
????//?處理返回文本格式信息的函數　示例
function?processTextResponse()?{
????if?(http_request.readyState?==?4)?{?//?判斷對象狀態（4表示完成）
????????if?(http_request.status?==?200)?{?//?200　信息已經成功返回，開始處理信息
????????????//這里面即是具體的處理代碼
????????????alert("Text文檔響應。");
????????}?else?{?//頁面不正常
????????????alert("您所請求的頁面有異常。");
????????}
????}
}　

//我們將以上文件保存為ajax.js文件
//然后在以后的每個需要應用Ajax的頁面中引入
<script?language="javascript"?src="ajax.js"></script>

這個Ajax應用程序開發框架現在還是一個簡單的初步的框架，其目的就是通過這個框架的示范，形式一個使用Ajax的基本方法和輪廓。 關于如何使用這個框架，將在以后的文章中寫出

?

補充：

如果使用POST方法傳遞。則content一般使用XML的形式。例如：

?

Code
function?login()
{
?
????var?xml?=?"<root><userName>123</userName><pwd>中國</pwd></root>";
????send_request("post","/StockSacChat/ChatHander.aspx",xml,result);
}
function?result()
{
?????if?(http_request.readyState?==?4)?{?
????????if?(http_request.status?==?200)?{
?????????
????????????alert(http_request.responseText);
????????}?else?{?//頁面不正常
????????????alert("頁面有異常。");
????????}
????}
}

?

而相應的后臺代碼 ASP.NET中可以如下獲得

Code
private?void?Page_Load(object?sender,?System.EventArgs?e)
{?
????XmlDocument?xmlDoc?=?new??System.Xml.XmlDocument();
????xmlDoc.Load(Request.InputStream);
????//得到root所有子節點
????XmlNodeList?xnl=xmlDoc.SelectSingleNode("root").ChildNodes;
????
????Response.Write(xnl.Item(0).InnerText);//輸出userName值
}

總結

以上是生活随笔為你收集整理的一个简单的Ajax开发框架的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。