ajax學習筆記1

標籤：class   blog   code   java   http   ext   

ajax是什嗎？

ajax即“Asynchronous Javascript + XML”（非同步JavaScript和XML），是指一種建立互動式網頁應用的網頁開發技術。能夠快速的從伺服器獲得所需資料和內容，實現局部重新整理讓使用者能夠更好的瀏覽網站。在沒有ajax的時候，網頁提交表單必須進行等待和重新整理，這時使用者必須等待伺服器的響應，使用者在當前頁面不能做其他事情。自從有了ajax，使用者在提交表單的時候不需要等待，可以瀏覽該頁的其它東西，表單提交之後伺服器能很快的返回所需的資料和網頁，網頁無需重新整理。

ajax能做什嗎？

在沒有ajax的時候，當我們在進行表單驗證的時候，我們必須輸入完之後提交頁面才能檢查資訊是否合法和有效，網頁還得重新整理，這樣給使用者的體驗是非常的不好，使用者辛辛苦苦輸入的資訊，當提交時候才發現資訊有錯誤和不合法，這就造成了使用者的體驗不是特別的好。使用ajax技術之後，檢查表單資訊能夠很快的從伺服器擷取資訊，並且沒有重新整理，這樣使用者使用起來就非常的方便。ajax還能實現局部重新整理，就像Google地圖那樣。

下面我們來學習一下怎麼使用ajax？

在使用ajax之前必須很好的掌握XMLHttpRequest的對象，因為ajax的使用都在圍繞著XMLHttpRequest對象進行。ajax的使用：

（1），首先建立XMLHttpRequest對象

var xmlhttp;if (window.XMLHttpRequest)  {// code for IE7+, Firefox, Chrome, Opera, Safari  xmlhttp=new XMLHttpRequest();  }else  {// code for IE6, IE5  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");  }

 （2），調用XMLHttpRequest的方法open（），和send（）

xmlhttp.open("GET","URL路徑",true);xmlhttp.send();

 

（3），伺服器返迴響應responseText

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

 

伺服器返回的值賦值給myDiv的標籤裡。
但是這樣還沒有達到效果，必須判斷http的狀態，代碼如下

xmlhttp.onreadystatechange=function()  {  if (xmlhttp.readyState==4 && xmlhttp.status==200)    {    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;    }  }