一、Ajax是什么
AJAX全稱為"Asynchronous JavaScript and XML"（異步JavaScript和XML），Ajax不是一個(gè)技術(shù)，它實(shí)際上是幾種技術(shù)，每種技術(shù)都有其獨(dú)特這處，合在一起就成了一個(gè)功能強(qiáng)大的新技術(shù)。作為創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開發(fā)技術(shù)，它有以下特點(diǎn)：
使用XHTML+CSS來表示信息
使用JavaScript操作DOM（Document Object Model）進(jìn)行動(dòng)態(tài)顯示及交互
使用XML和XSLT進(jìn)行數(shù)據(jù)交換及相關(guān)操作
使用XMLHttpRequest對(duì)象與Web服務(wù)器進(jìn)行異步數(shù)據(jù)交換
使用JavaScript將所有的東西綁定在一起
使用SOAP以XML的格式來傳送方法名和方法參數(shù)
類似于DHTML或LAMP，AJAX不是指一種單一的技術(shù)，而是有機(jī)地利用了一系列相關(guān)的技術(shù)。事實(shí)上，一些基于AJAX的"派生/合成"式（derivative/composite）的技術(shù)正在出現(xiàn)，如"AFLAX"。
AJAX的應(yīng)用使用支持以上技術(shù)的Web瀏覽器作為運(yùn)行平臺(tái)。這些瀏覽器目前包括：Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Mac OS的Safari。但是Opera不支持XSL格式對(duì)象，也不支持XSLT。（摘自于：http://zh.wikipedia.org/zh-cn/AJAX）
二、Ajax誕生的背景，為什么使用Ajax
我們都知道，用戶通過瀏覽器產(chǎn)生一個(gè)請(qǐng)求后，此請(qǐng)求通過HTTP協(xié)議，向服務(wù)器請(qǐng)求所要的資源，如果是一個(gè)圖片鏈接，則請(qǐng)求的就是一個(gè)圖片資源，如果是一個(gè)文件鏈接，則請(qǐng)求的是一個(gè)文件資源，多數(shù)情況下，請(qǐng)求的是整個(gè)網(wǎng)頁(yè)，網(wǎng)頁(yè)又根據(jù)自身的HTML代碼，請(qǐng)求各個(gè)具體的資源，比如圖片、音頻等。隨著網(wǎng)站的發(fā)展，用戶量越來越大，服務(wù)器的壓力也越來越大，這就暴露出了一個(gè)問題，即：大多數(shù)用戶在請(qǐng)求資源時(shí)，新請(qǐng)求的那個(gè)網(wǎng)頁(yè)中，與現(xiàn)在的那個(gè)網(wǎng)頁(yè)有很多相同的地方。但是由于請(qǐng)求的是整個(gè)網(wǎng)頁(yè)，它會(huì)重新從服務(wù)器獲取所有的資源（當(dāng)然，有很多圖片、文件之類的會(huì)從客戶端中獲取），這就是大大的浪費(fèi)。
為了解決這個(gè)問題，Ajax就誕生了，它主要的作用就是，通過XMLHttpRequest對(duì)象獲取服務(wù)器資源，局部刷新用戶正在瀏覽頁(yè)面，大大減輕了服務(wù)器的壓力，由于只獲取的是需要更新的資源，相對(duì)整個(gè)頁(yè)面的資源來說，瀏覽器也服務(wù)器之間的數(shù)據(jù)交互量也大大減少（大約只有原來的5%），大大加快了頁(yè)面的加載速度。
三、Ajax發(fā)展史
該技術(shù)原屬于微軟的一個(gè)研發(fā)小組，為了允許客戶端發(fā)送HTTP請(qǐng)求，研發(fā)出來的，但沒有得到廣泛應(yīng)用。后經(jīng)Google廣泛用于它的應(yīng)用程序進(jìn)行異步通訊交互，如google討論組、google地圖等，Ajax這個(gè)詞由《Ajax: A New Approach to Web Applications》一文所創(chuàng)，該文的迅速流傳提高了人們使用該項(xiàng)技術(shù)的意識(shí)，后來就出現(xiàn)了瘋狂的Ajax革命。
四、Ajax實(shí)踐
AJAX 的要點(diǎn)是 XMLHttpRequest 對(duì)象，所有的實(shí)現(xiàn)也是通過XMLHttpRequest對(duì)象操作的。但是在瀏覽器大戰(zhàn)的今天，不同的瀏覽器創(chuàng)建 XMLHttpRequest 對(duì)象的方法是有差異的。IE 瀏覽器使用 ActiveXObject，而其他的瀏覽器使用名為 XMLHttpRequest 的 JavaScript 內(nèi)建對(duì)象。
復(fù)制代碼 代碼如下:
// Mozilla, Safari,Opera 8.0+...
function ajaxFunction(){
var http_request;
if (window.XMLHttpRequest) {
http_request = new XMLHttpRequest();
} else if (window.ActiveXObject) {
// IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
alert("您的瀏覽器不支持Ajax");
return false;
}
}
http_request.onreadystatechange = alertContents;
http_request.open('GET', url, true);
http_request.send(null);
}
function alertContents() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
alert(http_request.responseText);
} else {
alert('There was a problem with the request.');
}
}
}
解釋：首先創(chuàng)建一個(gè)XMLHttpRequest對(duì)象http_request，如果支持window.XMLHttpRequest，則用new XMLHttpRequest() 來創(chuàng)建此對(duì)象。這條語(yǔ)句針對(duì) Firefox、Opera 以及 Safari 瀏覽器，如果不支持，則嘗試針對(duì)Internet Explorer 6.0+ 的Msxml2.XMLHTTP組件創(chuàng)建XMLHttpRequest，如果也不支持，則嘗試針對(duì) Internet Explorer 5.5+ 的Microsoft.XMLHTTP組件，如果仍然不支持，則說明用戶的瀏覽器版本太低了，提示用戶“您的瀏覽器不支持AJAX”。
XMLHttpRequest對(duì)象的onreadystatechange方法用于，狀態(tài)改變時(shí)要執(zhí)行的方法，用來處理這個(gè)響應(yīng)。
readyState的狀態(tài)是：
0 請(qǐng)求未初始化（open() 之前）
1 請(qǐng)求已提出，正在裝載 （調(diào)用 send() 之前）
2 裝載完畢，請(qǐng)求已發(fā)送（這里通常可以從響應(yīng)得到內(nèi)容頭部）
3 交互中，請(qǐng)求處理中（響應(yīng)中通常有部分?jǐn)?shù)據(jù)可用，但是服務(wù)器還沒有完成響應(yīng)）
4 請(qǐng)求已完成（可以訪問服務(wù)器響應(yīng)并使用它）
所以當(dāng)readyState等于4時(shí)，就表示一個(gè)完整的服務(wù)器響應(yīng)已經(jīng)收到了，接著，函數(shù)會(huì)檢查HTTP服務(wù)器響應(yīng)的狀態(tài)值。當(dāng)HTTP服務(wù)器響應(yīng)的值為200時(shí)，表示狀態(tài)正常。這時(shí)候才真正執(zhí)行客戶端要執(zhí)行的操作。
讀取從服務(wù)器返回過來的數(shù)據(jù)，有兩種方式：
1、http_request.responseText：以文本字符串的方式返回服務(wù)器的響應(yīng)
2、http_request.responseXML：以XMLDocument對(duì)象方式返回響應(yīng)
五、Ajax缺陷與不足
1、可能破壞瀏覽器后退按鈕的正常行為；
2、使用動(dòng)態(tài)頁(yè)面更新使得用戶難于將某個(gè)特定的狀態(tài)保存到收藏夾中；
3、Ajax的無(wú)刷新重載，由于頁(yè)面的變化沒有刷新重載那么明顯，所以容易給用戶帶來困擾——用戶不太清楚現(xiàn)在的數(shù)據(jù)是新的還是已經(jīng)更新過的；現(xiàn)有的解決有：在相關(guān)位置提示、數(shù)據(jù)更新的區(qū)域設(shè)計(jì)得比較明顯、數(shù)據(jù)更新后給用戶提示等；
4、一些手持設(shè)備（如手機(jī)、PDA等）現(xiàn)在還不能很好的支持Ajax。
六、Ajax工具
1、jQuery 開源JS框架，寫得更少，做得更多；
2、ASP.NET AJAX Extension 微軟AJAX工具箱；
3、ExtJS 一個(gè)自YUI延伸出來的Ajax框架。
您可能感興趣的文章:- ajax 技術(shù)和原理分析
- 談?wù)凙jax原理實(shí)現(xiàn)過程
- Ajax工作原理深入理解
- jquery的ajax跨域請(qǐng)求原理和示例
- 完成了AJAX樹附原理分析
- ajax 文件上傳應(yīng)用簡(jiǎn)單實(shí)現(xiàn)
- Ajax方式提交帶文件上傳的表單及隱藏iframe應(yīng)用
- Ajax+asp應(yīng)用實(shí)例 注冊(cè)模塊，表單提交
- AngularJS入門教程之與服務(wù)器(Ajax)交互操作示例【附完整demo源碼下載】
- Ajax PHP簡(jiǎn)單入門教程代碼
- Ajax原理與應(yīng)用案例快速入門教程
