標籤：接收 ted 否則 asc change 路徑 實現 常用 介面
一直以來都聽別人說Ajax,今天終於接觸到了。。。。。。。。。。
一.什麼是Ajax?
答:
AJAX即“ A synchronous J avascript And X ML”（非同步JavaScript和XML），是指一種建立互動式網頁應用的網頁開發技術。AJAX = 非同步 JavaScript和XML（標準通用標記語言 (SGML)的子集）。AJAX 是一種用於建立快速動態網頁的技術。通過在後台與伺服器進行少量資料交換，AJAX 可以使網頁實現非同步更新。這意味著可以在不重新載入整個網頁的情況下，對網頁的某部分進行更新。傳統的網頁（不使用 AJAX）如果需要更新內容，必須重載整個網頁頁面。二.Ajax的關鍵元素Ajax不是單一的技術，而是四種技術的集合
三.接下來我們講解XMLHttpRequest對象
講解之前先來熟悉一下它有哪些屬性和方法和傳統的有何差異？
下面的圖解更直觀的解釋：
XMLHttpRequest一些常用屬性：
當一個XMLHttpRequest對象被創立後，readyState屬性標示了當前對象處於什麼狀態，可以通過對該屬性的訪問，來判讀此次請求的狀態然後做出相應的操作
1.responseText屬性
responseText屬性包含客服端接收到的HTTP響應的常值內容，當readyState屬性為0、1或2時，responseText屬性包含一個Null 字元串：當readyState屬性值為3時，響應中包含客服端還沒完成的響應資訊；當readyState屬性值衛4，responseText屬性才包含完整的響應資訊。
2.responseXML屬性
只有當readyState屬性為4，並且回應標頭部的Content-Type的MIME類型被指定為XML(text/xml或者application/xml)時，該屬性才會有值並且被解析成一個XML文檔，否則該屬性為null。如果是回傳的XML文檔結構不良或者未完成響應回傳，該屬性也會為null。responseXML屬性用來描述被XMLHttpRequest解析後的XML文檔的屬性。
3.status屬性
status屬性描述了HTTP狀態碼，注意，僅當readyState屬性值為3（正在接受中）或者4（已載入）時，才能對此屬性進行訪問。如果在readyState屬性值小於3時，試圖去讀取status屬性值，將引發一個異常。
4.statusText屬性
statusText屬性描述了HTTP狀態碼文本，並且僅當readyState屬性為3或者4才可用。當readyState屬性為其他值時試圖存取statusText屬性將引發一個異常。
好了，接下來就切入真執行個體子當中吧！
（1） index.jsp頁面
<script type="text/javascript">
function checkUser(){
//擷取頁面上的輸入資料
var value=document.getElementById("uname").value;
//建立路徑
var url="ajaxServlet?name="+value;
//建立XMLHttpRequest對象
var xhr;
//能力檢測 判斷是否是IE瀏覽器
if(windown.XMLHttpRequest){
//非IE瀏覽器
xhr=new XMLHttpRequest();
}else{
//IE瀏覽器
xhr=new ActiveObject("Microsoft.XMLHTTP");
}
//建立一個請求 (請求方式，url，是否非同步（預設為false）)
xhr.open("get",url,true);
//在狀態發生改變時發生
xhr.onreadystatechange=function(){
if(xhr.readystate==4&&xhr.status==200){
//擷取回傳的資料
var result=xhr.responseText;
document.getElementById("msg").innerText(result);
}
}
</script>
（2） <body>
使用者名稱：<input id="uname" onblur="checkUser()" /><span id="msg"></span>
</body>
（3）AjaxServlet書寫 public AjaxServlet extends HttpServlet{ public void doGet(HttpServletRequest request,HttpServletResponse response) throws ServletException,IOException { doPost(request,response); } public void doPost(HttpServletRequest request,HttpServletResponse response) throws ServletException,IOException { String uname=request.getParamter("name"); if(admin.equals(uname)){ //把訊息回送給頁面 response.getWriter().write("已經註冊"); }else{ response.getWriter().write("可以註冊"); } } }（4）web.xml <servlet> <servlet-name>AjaxServlet</servlet-name> <servlet-class>cn.servlet.AjaxServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>AjaxServlet</servley-name> <url-pattern>/ajaxServlet</url-pattern> </servlet-mapping>完成上序的書寫，你的ajax基本上完成了，接下來就是測試了。。。。。。這就是我第一接觸Ajax接觸的書寫方法，後續還會學習，也會記錄下來，好多人說過現在學的這些東西擱到現在已經不是稀奇東西了，也對現在電腦發展這麼快，一些技術已經不吃香了，可我們為什麼要學呢？因為我們不會。。。。。。當你站在一定高度看待事情時，你就會有不同的見解，人的成長亦是如此。。。。。。謹記人生道路上的人們
Ajax 之XMLHttpRequest講解
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
