- 相關推薦
ajax詳細解釋
什么是Ajax
Ajax是Asynchronous JavaScript and XML的縮寫，這一技術能夠向服務器請求額外的數據而無需卸載整個頁面，會帶來良好的用戶體驗。傳統的HTTP請求流程大概是這樣的，瀏覽器向服務器發送請求-〉服務器根據瀏覽器傳來數據生成response-〉服務器把response返回給瀏覽器-〉瀏覽器刷新整個頁面顯示最新數據，這個過程是同步的，順序執行。
AJAX 在瀏覽器與 Web 服務器之間使用異步數據傳輸（HTTP 請求）從服務器獲取數據，這里的異步是指脫離當前瀏覽器頁面的請求、加載等單獨執行，這意味著可以在不重新加載整個網頁的情況下，通過JavaScript接受服務器傳來的數據，然后操作DOM將新數據對網頁的某部分進行更新，使用Ajax最直觀的感受是向服務器獲取新數據不需要刷新頁面等待了。
ajax的理解(一)
Ajax是Asynchronous Javascript And XML的縮寫。 作用：通過Ajax可以使用Javascript語句來調用XMLHttpRequest對象，直接與服務器進行通訊，可以在不重載頁面的情況下與服務器交換數據。 1、創建XML
Ajax是Asynchronous Javascript And XML的縮寫。
作用：通過Ajax可以使用Javascript語句來調用XMLHttpRequest對象，直接與服務器進行通訊，可以在不重載頁面的情況下與服務器交換數據。
1、創建XMLHttpRequest對象
var xhr = new XMLHttpRequest()
對于IE早期版本（IE7及以下版本）使用，new ActiveXObject("Microsoft.XMLHTTP")、new ActiveXObject("Msxml2.XMLHTTP")等方式創建對象
2、XMLHttpRequest對象常用屬性和常用方法
屬性
readystate 返回XMLHTTP請求的當前狀態碼
state 返回當前請求的HTTP狀態碼
statusText 返回HTTP狀態碼對應的文本
方法
onreadystatechange 監聽readystate和state狀態
ajax的理解（二）
ajax方法：通過 HTTP 請求加載遠程數據
get方法： 通過遠程 HTTP GET 請求載入信息
post方法：通過遠程 HTTP POST 請求載入信息
1、創建XMLHttpRequest對象
function createXHR() { return window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");}
2、將鍵值對轉換成拼接串
function params(data) { var a = []; for (var i in data) { a.push(encodeURIComponent(i) + "=" + encodeURIComponent(data[i])); } return a.join("&"); }
3、封裝ajax方法
參數
method 請求方法 get和post 默認get
data 鍵值對 {key:value}
url 鏈接地址
cache 緩存 true 和 false 默認true帶緩存
success 成功 error 異常
function ajax(args) { var xhr = createXHR(); var data = http://www.cnblogs.com/kuikui/archive/2012/01/12/params(args.data); if (/get/i.test(args.method)) { // 當為get方式時 將data直接拼接到url后 args.url += "" + data; } if (!args.cache) { //無緩存 if (args.url.indexOf("") < 0) { //當無參數data args.url += ""; } args.url += "&" + (new Date()); // Math.random(); } xhr.open(args.method, args.url, true); xhr.onreadystatechange = function () { if (4 == xhr.readyState && 200 == xhr.status) { args.success(xhr.responseText, xhr.responseXML); } else { args.error(); } } if (/post/i.test(args.method)) { xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.send(data); } else { xhr.send();
【ajax詳細解釋】相關文章：
IIS詳細錯誤代碼以及解釋08-04
AJAX的工作原理及優缺點08-16
關于Ajax技術原理的幾點總結01-10
基于ajax實現無刷新分頁的方法10-15
解析ajax請求post和get的區別10-01
如何利用ajax獲取博文列表08-03
淺談Ajax修改購物車的方法06-29
Ajax使用JSON數據格式案例分析01-10
揭秘利用ajax實現預覽鏈接看鏈接的內容10-19