亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

AJAX是什么?如何在JavaScript中使用?

AJAX是什么?如何在JavaScript中使用?

DIEA 2021-02-01 06:06:48
聽說Ajax的核心是JavaScript對象?那它到底是一個怎樣的技術呢,求大神普及下。
查看完整描述

2 回答

?
慕田峪9158850

TA貢獻1794條經驗 獲得超8個贊

JavaScript能流行,一個很重要的原因是AJAX技術的應用。在網頁中有很多的應用。舉兩個常見的AJAX應用的例子:
1、 在搜索中,我們輸入關鍵字時,網頁會實時展現搜索結果;這是用AJAX實現的。
2、 使用地圖時,地圖會根據用戶顯示的位置不停的更新。這也是通過AJAX實現。

那么什么是AJAX呢?
AJAX全稱為Asynchronous JavaScript And XML直譯就是異步的JavaScript和XML(這里我們主要介紹下JavaScript中AJAX的應用)
通常當JavaScript向服務器發送請求獲取數據時,服務器會返回數據。在傳統沒有使用AJAX的網頁中,需要刷新頁面使其重新加載。而AJAX可以使網頁在不重新加載頁面的情況下對網頁的局部進行更新。(比如,當你要放大地圖的時候,你會不斷的向服務器請求地圖當前位置的詳細信息,服務器返回數據給你,這里我們并不需要重新加載整個頁面,不然用戶體驗就太差了。而是局部更新頁面。)

由于我不可能在這寫一個地圖這樣復雜的例子,而為了演示AJAX的使用,我借用了秒秒學的一個簡單示例:

// 簡單的AJAX舉例。

// 1: 創建請求變量
var myRequest;

// 瀏覽器的特征檢查。
if (window.XMLHttpRequest) { //若支持,則是火狐、谷歌等瀏覽器。
myRequest = new XMLHttpRequest();
} else if (window.ActiveXObject) { // 若不支持, 則是IE瀏覽器。
myRequest = new ActiveXObject("Microsoft.XMLHTTP");
}

// 2: 為請求添加事件處理代碼。
myRequest.onreadystatechange = function(){
console.log("匿名函數被調用!");
console.log(myRequest.readyState);
if (myRequest.readyState === 4) {
var p = document.createElement("p");
var t = document.createTextNode(myRequest.responseText);
p.appendChild(t);
document.getElementById("mainContent").appendChild(p);
}
};

// 3: 配置發送請求
myRequest.open('GET', 'simple.txt', true);
myRequest.send(null);

//....

使用AJAX主要分三部分,如示例中的
1、 創建請求的變量。
在script文件中,首先聲明XMLHttpRequest對象,這也是題主說的Ajax的核心。瀏覽器頁面能通過XMLHttpRequest對象和服務器進行通訊。因為這個對象的創建因瀏覽器的不同而有區別。所以我們要用if語句判斷XMLHttpRequest是否存在。

2、 為請求添加事件處理代碼
創建好XMLHttpRequest對象后,就可以向服務器發送請求了,不過我們首先處理服務器響應的事件。當服務器響應后會觸發myRequest對象的onreadystatechange事件。
在onreadystatechange事件中我們看到myRequest調用了readyState屬性,readyState有4個值表示目前響應所在的階段,各數值表示如下:
l 1:請求已經建立,但是還沒有發送(還沒有調用 send())。
l 2:請求已發送,正在處理中(通?,F在可以從響應中獲取內容頭)。
l 3:請求在處理中;通常響應中已有部分數據可用了,但是服務器還沒有完成響應的生成。
l 4:響應已完成;您可以獲取并使用服務器的響應了。
我們一般只關心readyState的值為4的情況,表示響應已完成。

3、 配置發送請求
使用open方法配置請求。它有三個參數:
1、第一個參數表示用GET獲取服務器中的數據。
2、第二個參數是一個服務器地址,這里我們用本地的simple.txt代替,省去創建服務器的麻煩。
3、第三個參數true表示請求是異步的,即當請求發送后,JavaScript不會為了等待服務器的響應而阻塞,它會繼續執行后續代碼。

配置好請求后,用send方法發送請求,這里給send傳遞的參數是null,若有其它參數需要發送,也可以傳遞給send方法。

這樣AJAX的簡單使用例子就說完了,以上示例來自教程網站秒秒學,希望對你有幫助。



查看完整回答
反對 回復 2021-03-27
?
郎朗坤

TA貢獻1921條經驗 獲得超9個贊

AJAX全稱為Asynchronous JavaScript And XML直譯就是異步的JavaScript和XML。

通常當JavaScript向服務器發送請求獲取數據時,服務器會返回數據。在傳統沒有使用AJAX的網頁中,需要刷新頁面使其重新加載。而AJAX可以使網頁在不重新加載頁面的情況下對網頁的局部進行更新。

使用AJAX主要分三部分:

1、 創建請求的變量。
2、 為請求添加事件處理代碼。
3、 配置發送請求。

【AJAX舉例】

12345678910111213141516var myRequest;if (window.XMLHttpRequest) {  myRequest = new XMLHttpRequest();} else if (window.ActiveXObject) { myRequest = new ActiveXObject("Microsoft.XMLHTTP");}myRequest.onreadystatechange = function(){console.log("匿名函數被調用!");console.log(myRequest.readyState);if (myRequest.readyState === 4) {var p = document.createElement("p");var t = document.createTextNode(myRequest.responseText);p.appendChild(t);document.getElementById("mainContent").appendChild(p);}};myRequest.open('GET''simple.txt'true);myRequest.send(null);



查看完整回答
反對 回復 2021-03-27
  • 2 回答
  • 0 關注
  • 260 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號