Ajax:
全稱是 Asynchronous JavaScript And XML,中文翻譯爲異步的JavaScript和XML,是一種用於創建快速動態網頁的技術。不需要任何瀏覽器插件,但需要用戶允許JavaScript在瀏覽器上執行。
注意:Ajax不是新的編程語言!!!而是一種使用現有標準的新方法!!!
爲了在不重新加載整個頁面的情況下,與服務器交換數據並更新部分網頁內容。由 Jesse James Garrett 在2005年提出Ajax這個概念。即通過在後臺與服務器進行少量數據交換,使網頁實現異步更新。
它本身不是單一技術,是一串技術的集合,主要有:
- JavaScript:通過用戶或其他與瀏覽器相關事件捕獲交互行爲;
- XMLHttpRequest對象:通過這個對象可以在不中斷其它瀏覽器任務的情況下向服務器發送請求;
- 服務器上的文件:以XML、HTML或JSON格式保存文本數據;
- 其它JavaScript:解釋來自服務器的數據(比如PHP從MySQL獲取的數據)並將其呈現到頁面上。
Ajax的優勢主要有以下幾點:
- 不需要插件支持(一般瀏覽器且默認開啓JavaScript即可);
- 用戶體驗極佳(不刷新頁面即可獲取可更新的數據);
- 提升Web程序的性能(在傳遞數據方面做到按需放鬆,不必整體提交);
- 減輕服務器和帶寬的負擔(將服務器的一些操作轉移到客戶端);
而Ajax的不足有以下幾點:
- 不同版本的瀏覽器對XMLHttpRequest對象支持度不同(特別是IE5以下);
- 前進、後退的功能被破壞(因爲Ajax永遠在當前頁,不會記錄前後頁面);
- 搜索引擎的支持度不夠(因爲搜索引擎爬蟲還不能理解JS引起變化數據的內容);
執行過程:
- 準備頁面請求,創建XMLHttpRequest對象;
- 使用XMLHttpRequest對象的open()和send()方法發送資源請求給服務器;
- 後臺計算;
- 使用onreadystatechange函數,監聽服務器,狀態改變時發送數據回客戶端;
- 使用XMLHttpRequest對象的responseText或responseXML屬性獲得服務器的響應;
以get方法爲例:
<script>
// 創建XMLHttpRequest對象
var ajax; // 考慮IE兼容
if (window.XMLHttpRequest) ajax=new XMLHttpRequest();
else ajax=new ActiveXObject("Microsoft.XMLHTTP");
// 使用XMLHttpRequest對象的open()和send()方法發送資源請求給服務器
ajax.open("GET",url,true); // get請求,url爲請求地址,true代表異步
ajax.send();
// 使用onreadystatechange函數,監聽服務器,狀態改變時發送數據回客戶端
ajax.onreadystatechange=function(){
if (ajax.readyState==4 && ajax.status==200){
// 使用XMLHttpRequest對象的responseText或responseXML屬性獲得服務器的響應
document.innerHTML=ajax.responseText;
}
}
</script>