ajax詳細(xì)解釋

ajax詳細(xì)解釋

　　什么是Ajax

　　Ajax是Asynchronous JavaScript and XML的縮寫，這一技術(shù)能夠向服務(wù)器請(qǐng)求額外的數(shù)據(jù)而無需卸載整個(gè)頁面，會(huì)帶來良好的用戶體驗(yàn)。傳統(tǒng)的HTTP請(qǐng)求流程大概是這樣的，瀏覽器向服務(wù)器發(fā)送請(qǐng)求-〉服務(wù)器根據(jù)瀏覽器傳來數(shù)據(jù)生成response-〉服務(wù)器把response返回給瀏覽器-〉瀏覽器刷新整個(gè)頁面顯示最新數(shù)據(jù)，這個(gè)過程是同步的，順序執(zhí)行。

　　AJAX 在瀏覽器與 Web 服務(wù)器之間使用異步數(shù)據(jù)傳輸（HTTP 請(qǐng)求）從服務(wù)器獲取數(shù)據(jù)，這里的異步是指脫離當(dāng)前瀏覽器頁面的請(qǐng)求、加載等單獨(dú)執(zhí)行，這意味著可以在不重新加載整個(gè)網(wǎng)頁的情況下，通過JavaScript接受服務(wù)器傳來的數(shù)據(jù)，然后操作DOM將新數(shù)據(jù)對(duì)網(wǎng)頁的某部分進(jìn)行更新，使用Ajax最直觀的感受是向服務(wù)器獲取新數(shù)據(jù)不需要刷新頁面等待了。

　　ajax的理解(一)

　　Ajax是Asynchronous Javascript And XML的縮寫。 作用：通過Ajax可以使用Javascript語句來調(diào)用XMLHttpRequest對(duì)象，直接與服務(wù)器進(jìn)行通訊，可以在不重載頁面的情況下與服務(wù)器交換數(shù)據(jù)。 1、創(chuàng)建XML

　　Ajax是Asynchronous Javascript And XML的縮寫。

　　作用：通過Ajax可以使用Javascript語句來調(diào)用XMLHttpRequest對(duì)象，直接與服務(wù)器進(jìn)行通訊，可以在不重載頁面的情況下與服務(wù)器交換數(shù)據(jù)。

　　1、創(chuàng)建XMLHttpRequest對(duì)象

　　var xhr = new XMLHttpRequest()

　　對(duì)于IE早期版本（IE7及以下版本）使用，new ActiveXObject("Microsoft.XMLHTTP")、new ActiveXObject("Msxml2.XMLHTTP")等方式創(chuàng)建對(duì)象

　　2、XMLHttpRequest對(duì)象常用屬性和常用方法

　　屬性

　　readystate 返回XMLHTTP請(qǐng)求的當(dāng)前狀態(tài)碼

　　state 返回當(dāng)前請(qǐng)求的HTTP狀態(tài)碼

　　statusText 返回HTTP狀態(tài)碼對(duì)應(yīng)的文本

　　方法

　　onreadystatechange 監(jiān)聽readystate和state狀態(tài)

　　ajax的理解（二）

　　ajax方法：通過 HTTP 請(qǐng)求加載遠(yuǎn)程數(shù)據(jù)

　　get方法： 通過遠(yuǎn)程 HTTP GET 請(qǐng)求載入信息

　　post方法：通過遠(yuǎn)程 HTTP POST 請(qǐng)求載入信息

　　1、創(chuàng)建XMLHttpRequest對(duì)象

　　function createXHR() {   return window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");}

　　2、將鍵值對(duì)轉(zhuǎn)換成拼接串

　　function params(data) {   var a = [];   for (var i in data) {    a.push(encodeURIComponent(i) + "=" + encodeURIComponent(data[i]));   }   return a.join("&");  }

　　3、封裝ajax方法

　　參數(shù)

　　method 請(qǐng)求方法 get和post 默認(rèn)get

　　data 鍵值對(duì) {key:value}

　　url 鏈接地址

　　cache 緩存 true 和 false 默認(rèn)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)) { // 當(dāng)為get方式時(shí) 將data直接拼接到url后    args.url += "" + data;   }   if (!args.cache) {  //無緩存    if (args.url.indexOf("") < 0) { //當(dāng)無參數(shù)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詳細(xì)解釋】相關(guān)文章：

象棋的術(shù)語解釋07-27

外貿(mào)船務(wù)流程（詳細(xì)）05-26

常用的粵語及其解釋06-05

工程制圖詳細(xì)介紹及目錄08-26

茶道的詳細(xì)操作程序11-02

淘寶詳細(xì)退貨退款流程03-03

巧克力詳細(xì)制作方法07-27

手沖咖啡的詳細(xì)過程11-17

京劇名詞解釋06-21

國學(xué)經(jīng)典《小兒語》原文及解釋03-03