Ajax原生使用
AJAX 應用
-
運用XHTML+CSS來表達資訊；
-
運用JavaScript操作DOM（Document Object Model）來執行動態效果；
-
運用XML和XSLT操作資料;
-
運用XMLHttpRequest或新的Fetch API與網頁服務器進行異步資料交換；
-
註意：AJAX與Flash、Silverlight和Java Applet等RIA技術是有區分的。
什麽是 AJAX ？
AJAX = Asynchronous JavaScript and XML（異步的 JavaScript 和 XML）。
AJAX 不是新的編程語言，而是一種使用現有標準的新方法。
AJAX 最大的優點是在不重新加載整個頁面的情況下，可以與服務器交換數據並更新部分網頁內容。
AJAX 不需要任何瀏覽器插件，但需要用戶允許JavaScript在瀏覽器上執行。
AJAX = 異步 JavaScript 和 XML。
AJAX 是一種用於創建快速動態網頁的技術。
通過在後臺與服務器進行少量數據交換，AJAX 可以使網頁實現異步更新。這意味著可以在不重新加載整個網頁的情況下，對網頁的某部分進行更新。
傳統的網頁（不使用 AJAX）如果需要更新內容，必需重載整個網頁面。
有很多使用 AJAX 的應用程序案例：新浪微博、Google 地圖、開心網等等。
AJAX是基於現有的Internet標準
AJAX是基於現有的Internet標準，並且聯合使用它們：
- XMLHttpRequest 對象 (異步的與服務器交換數據)
- JavaScript/DOM (信息顯示/交互)
- CSS (給數據定義樣式)
- XML (作為轉換數據的格式)
AJAX應用程序與瀏覽器和平臺無關的！
AJAX 工作原理
一個基本的ajax寫法：
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 瀏覽器執行代碼
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 瀏覽器執行代碼
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","/try/ajax/ajax_info.txt",true);
xmlhttp.send();
}
XMLHttpRequest類的主要屬性:
onreadystatechange
readyState
status
responseText
xmlhttp.onreadystatechange與readyState屬性有關，當readyState改變時它才會觸發。。
readyState狀態碼如下：
0：請求未初始化（還沒有調用 open()）。
1：請求已經建立，但是還沒有發送（還沒有調用 send()）。
2：請求已發送，正在處理中（通常現在可以從響應中獲取內容頭）。
3：請求在處理中；通常響應中已有部分數據可用了，但是服務器還沒有完成響應的生成。
4：響應已完成；您可以獲取並使用服務器的響應了。
狀態為0表明open的時候也是會觸發onreadystatechange事件的
XMLHttpRequest實例化後的對象的主要屬性
xmlhttp.open("GET","demo_get2.asp?fname=Bill&lname=Gates",true);
xmlhttp.send();
xmlhttp.open("POST","ajax_test.asp",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Bill&lname=Gates");
Ajax原生使用