當前位置:文思屋>社會工作>電腦培訓>

ajax詳細解釋

文思屋 人氣:1.08W

 什麼是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