當前位置:學問君>人在職場>電腦培訓>

ajax詳細解釋

學問君 人氣:1.07W

 什麼是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("TTP")、new ActiveXObject("TTP")等方式創建對象

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 ttpRequest ? new XMLHttpRequest() : new ActiveXObject("TTP");}

2、將鍵值對轉換成拼接串

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

3、封裝ajax方法

參數

method 請求方法 get和post 默認get

data 鍵值對 {key:value}

url 連結地址

cache 快取 true 和 false 默認true帶快取

success 成功 error 異常

function ajax(args) {   var xhr = createXHR();   var data = ();   if (/get/(od)) { // 當爲get方式時 將data直接拼接到url後     += "" + data;   }   if (!e) {  //無快取    if (xOf("") < 0) { //當無參數data     += "";    }     += "&" + (new Date()); // om();   }   (od, , true);   adystatechange = function () {    if (4 == yState && 200 == us) {     ess(onseText, onseXML);    }    else {     r();    }   }   if (/post/(od)) {    equestHeader("Content-Type", "application/x-www-form-urlencoded");    (data);   }   else {    ();

TAGS:Ajax