原理及概念
AJAX即“Asynchronous Javascript And XML”（異步Javascript和XML），是一種用于創建快速動態網頁的技術。
動態網頁：是指可以通過服務器語言結合數據庫隨時修改數據的網頁。
靜態網頁，隨著html代碼的生成，頁面的內容和顯示效果就基本上不會發生變化了——除非你修改頁面代碼。
AJAX = 異步 Javascript和XML（標準通用標記語言的子集）。
AJAX 是與服務器交換數據并更新部分網頁的藝術，在不重新加載整個頁面的情況下。
Ajax的優勢
AJAX 在瀏覽器與 Web 服務器之間使用異步數據傳輸（HTTP 請求），這樣就可使網頁從服務器請求少量的信息，而不是整個頁面。
AJAX 可使因特網應用程序更小、更快，更友好。
AJAX 是一種獨立于 Web 服務器軟件的瀏覽器技術。
AJAX 基于下列 Web 標準：
JavascriptXMLHTMLCSS在 AJAX 中使用的 Web 標準已被良好定義，并被所有的主流瀏覽器支持。AJAX 應用程序獨立于瀏覽器和平臺。
Web 應用程序較桌面應用程序有諸多優勢；它們能夠涉及廣大的用戶，它們更易安裝及維護，也更易開發。
不過，因特網應用程序并不像傳統的桌面應用程序那樣完善且友好。
通過 AJAX，因特網應用程序可以變得更完善，更友好。
Ajax的異步
異步：是相對于同步而言的，我們學過的定時器也是異步的一種，也就是其他程序不需要等待定時器的代碼全部執行完畢以后才能執行代碼。因為定時器有可能是無限循環執行代碼的，如果等待定時器執行完畢那么其他的代碼將永遠無法運行。所以異步編程就是相對于其他代碼是獨立完成的。也就是上面所說的ajax是獨立于瀏覽器平臺的。
Tip：事件也是異步執行的，事件是發生某件事情后才會執行代碼的。
同步：我們之前所寫的代碼除了定時器和事件大部分都是同步執行的。也就是同一個代碼塊中都是從上到下執行的。
Ajax的工作原理
Ajax 核心對象XMLHttpRequest
var _hr=new window.XMLHttpRequest();
通過該實例化的對象向服務器
發出請求，等待服務器響應
服務器響應完成后客戶端再處理
服務器端響應的數據。
Ajax請求服務器的過程中有5個狀態
0：表示請求服務器之前
1：表示打開遠程服務器鏈接對應open方法
2：表示向服務器發送數據對應send方法
3：表示服務器響應過程中并未結束
4：表示服務器響應完成
/** * 創建XMLHttpRequest對象 * @param _method 請求方式: post||get * @param _url 遠程服務器地址 * @param _async 是否異步 * @param _parameter 向服務器發送數據 * @param _callBack 回調函數 */function parameterDeal(_parameter){ var _sender=""; if(_parameter instanceof Object){ for(var k in _parameter){ _sender+=k+"="+_parameter[k]+"&"; } return _sender.replace(//&$/g,""); }else{ return _parameter; }}function createXMLHttpRequest(){ try{ return new window.XMLHttpRequest(); }catch(e){ try{ return new ActiveXObject("MSXML2.XMLHTTP.6.0"); }catch(e){ try{ return new ActiveXObject("MSXML2.XMLHTTP.3.0"); }catch(e){ try{ return new ActiveXObject("MSXML2.XMLHTTP"); }catch(e){ try{ return new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ throw new Error("該瀏覽器版本太低,已經被大部分市場淘汰,請升級!!!"); return; } } } } }}function ajaxRequest(_method,_url,_async,_parameter,_callBack){ var _ajax=createXMLHttpRequest(); if(_ajax){ _ajax.onreadystatechange=function(){ if(_ajax.readyState==4 && _ajax.status==200){ _callBack(_ajax.responseText); } } _ajax.open(_method,_url,_async); _ajax.setRequestHeader("content-type","application/x-www-form-urlencoded;charset=utf-8"); _ajax.send(parameterDeal(_parameter)); }}這是封裝好了的原生Ajax，在使用的過程中，只需要新建一個js文件，將這段代碼放進去，什么都不要改，在HTML頁面引入之后，調用 ajaxRequest()函數，傳入你想要的參數，就可以正常使用了。
此方法純屬個人封裝，有更精簡方法的朋友歡迎與我分享！
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持VeVb武林網。
新聞熱點
疑難解答
圖片精選
