????:一. ajax的簡介 ajax 的全稱是Asynchronous(異步的意思) JavaScript and XML,是一種創(chuàng)建交互式網頁應用的網頁開發(fā)技術 ajax技術的流行得益于google的大力推廣,正是由于google產品對ajax技術的廣泛應用,使得ajax流行起來了?! jax其核心有JavaScript、XMLHTTPRequest、DOM對象組成,通過XMLHttpReque
一. ajax的簡介
ajax 的全稱是Asynchronous(異步的意思) JavaScript and XML,是一種創(chuàng)建交互式網頁應用的網頁開發(fā)技術
ajax技術的流行得益于google的大力推廣,正是由于google產品對ajax技術的廣泛應用,使得ajax流行起來了。
ajax其核心有JavaScript、XMLHTTPRequest、DOM對象組成,通過XMLHttpRequest對象來向服務器發(fā)異步請求,從服務器獲得數(shù)據,然后用JavaScript來操作DOM而更新頁面。這其中最關鍵的一步就是從服務器獲得請求數(shù)據。
XMLHttpRequest是ajax的核心機制,它是在IE5中首先引入的,是一種支持異步請求的技術。簡單的說,也就是js可以及時向服務器提出請求和處理響應,而不阻塞用戶。達到無刷新的效果。下面來看一下ajax的請求步驟。
二.ajax的請求步驟
1、創(chuàng)建異步對象
Var ajax=new XMLHttpRequest();
2、注冊回調函數(shù)
ajax.onreadystatechange=callback;
要注意的是callback不能寫成callback(),我們是想把方法名告訴onreadystatechange這個屬性,如果加了括號,就相當于把返回值告訴了onreadystatechange屬性。
3、使用open方法設置和服務器端交互的基本信息
1.)GET方式交互
ajax.open("GET","AJAX?name=" + userName,true);
2.)POST方式交互
ajax.open("POST","AJAX",true);
4、設置發(fā)送的數(shù)據,開始和服務器端交互
1.)GET方式
ajax.send(null);
2.)POST方式
ajax.send("name=" + userName);
5、更新界面
在回調函數(shù)中判斷交互是否結束,響應是否正確,并根據需要獲取服務器返回的數(shù)據,并更新頁面
array.push(ajax.readyState); //判斷和服務器端的交互是否完成,還要判斷服務器端是否正確返回了數(shù)據
if(ajax.readyState == 4 && ajax.status == 200){ //第一個判斷條件是表示和服務器端的交互已經完成,第二個判斷條件是服務器的是響應代碼是200,正確返回了數(shù)據
var message=ajax.responseText; //XML數(shù)據對應的DOM對象的接受方法,使用的前提是,服務器端需要設置contenttype為text/xml
var div=document.getElementById("message");
div.innerHTML=message; //將獲取的xml數(shù)據添加到頁面上
console.log(array)
}
三.ajax的優(yōu)點
1、最大的一點是頁面無刷新,在頁面內與服務器通信,給用戶的體驗非常好。
2、使用異步方式與服務器通信,不需要打斷用戶的操作,具有更加迅速的響應能力。
3、可以把以前一些服務器負擔的工作轉嫁到客戶端,利用客戶端閑置的能力來處理,減輕服務器和帶寬的負擔,節(jié)約空間和寬帶租用成本。并且減輕服務器的負擔,ajax的原則是“按需取數(shù)據”,可以最大程度的減少冗余請求,和響應對服務器造成的負擔。
4、基于標準化的并被廣泛支持的技術,不需要下載插件或者小程序。
四.ajax的缺點
1、ajax干掉了瀏覽器的back按鈕,對瀏覽器后退機制的破壞。
2、安全問題,ajax技術就如同對企業(yè)數(shù)據建立了一個直接通道,暴露出請求的接口的數(shù)據.
3、對搜索引擎支持的不友好.
4、破壞了程序的異常機制,如果程序拋出異常,對調試帶來不方