Ajax向服務(wù)器發(fā)送請(qǐng)求
Ajax對(duì)象創(chuàng)建完成后，下面就要講解一下Ajax如何使用。首先詳細(xì)講解一下Ajax向服務(wù)器發(fā)送請(qǐng)求所需的兩個(gè)方法，具體如下：
(1)open()方法
open()方法用于創(chuàng)建一個(gè)新的HTTP請(qǐng)求，并指定此請(qǐng)求的類型(如GET、POST等)、URL以及驗(yàn)證信息，其聲明方式如下所示：
在上述聲明中，method用于指定請(qǐng)求的類型，其值可為POST、GET、PUT及PROPFIND，大小寫不敏感;URL表示請(qǐng)求的地址，可以為絕對(duì)地址也可以為相對(duì)地址，并且可以傳遞查詢字符串。其余參數(shù)為可選參數(shù)，其中，asyncFlagy用于指定請(qǐng)求方式，同步請(qǐng)求為false，默認(rèn)為異步請(qǐng)求true;userName用于指定用戶名，password用于指定密碼。
(2)send()方法
send()方法用于發(fā)送請(qǐng)求到HTTP服務(wù)器并接收回應(yīng)。其聲明方式如下所示：
在上述聲明中，content用于指定要發(fā)送的數(shù)據(jù)，其值可為DOM對(duì)象的實(shí)例、輸入流或字符串，一般與POST請(qǐng)求類型配合使用，需要注意的是，如果請(qǐng)求聲明為同步，該方法將會(huì)等待請(qǐng)求完成或者超時(shí)才會(huì)返回，否則此方法將立即返回。
需要注意的是，在使用GET方式傳遞特殊字符或中文參數(shù)時(shí)，要使用JavaScript中的encodeURIComponent()函數(shù)將其轉(zhuǎn)換成“%十六進(jìn)制數(shù)”的形式，防止在某些瀏覽器(如IE瀏覽器)中中文亂碼的問(wèn)題。
Ajax接收服務(wù)器返回的信息
了解Ajax向服務(wù)器發(fā)送請(qǐng)求后，下面將對(duì)Ajax如何接收服務(wù)器返回的信息(例如，HTML標(biāo)簽、CSS樣式、字符串、XML、JSON等)，進(jìn)行詳細(xì)講解。具體如下：
(1)readyState屬性
readyState屬性用于返回Ajax的當(dāng)前狀態(tài)，狀態(tài)值有5種形式，具體如表所示。
(2)onreadystatechange屬性
onreadystatechange事件屬性用于感知readyState屬性狀態(tài)的改變。為了大家更好的理解這兩個(gè)屬性的使用，下面創(chuàng)建一個(gè)服務(wù)器端的文件index.php，用于輸出字符串，然后在瀏覽器端index.html中向服務(wù)器端發(fā)送請(qǐng)求，并在控制臺(tái)輸出狀態(tài)值。具體示例如下所示：
創(chuàng)建服務(wù)器端文件：index.php
創(chuàng)建瀏覽器端文件：index.html
在瀏覽器中訪問(wèn)客戶端文件，按“F12”鍵，切換到控制臺(tái)，查看輸出結(jié)果，具體如下圖所示。
從圖中可以看出，通過(guò)onreadystatechange事件屬性可以清晰的感知Ajax狀態(tài)的改變，同時(shí)使用readyState獲取轉(zhuǎn)變后的狀態(tài)值。例如Ajax從0(未初始化)狀態(tài)變成1(初始化)狀態(tài)值時(shí)，Ajax此時(shí)的狀態(tài)值為1。
(3)status屬性
status屬性用于返回當(dāng)前請(qǐng)求的HTTP狀態(tài)碼，常見(jiàn)的狀態(tài)碼如表所示。
值得一提的是，在感知當(dāng)前Ajax對(duì)象狀態(tài)時(shí)，為了追求程序的嚴(yán)謹(jǐn)性，需要同時(shí)判斷當(dāng)前HTTP狀態(tài)status是否等于200(請(qǐng)求成功)。
需要注意的是，Ajax中的statusText屬性，僅當(dāng)數(shù)據(jù)發(fā)送并接收完畢后，才可以獲取當(dāng)前請(qǐng)求的響應(yīng)狀態(tài)。
(4)獲取響應(yīng)信息的相關(guān)屬性
當(dāng)數(shù)據(jù)接收完畢且請(qǐng)求服務(wù)器的請(qǐng)求成功時(shí)，即可以使用Ajax中提供的相關(guān)屬性獲取服務(wù)器的響應(yīng)信息。具體的屬性及相關(guān)說(shuō)明如下表所示。
在上表中，responseText屬性用于返回文本格式的響應(yīng)數(shù)據(jù);屬性responseBody表示直接從服務(wù)器返回并未經(jīng)解碼的二進(jìn)制數(shù)據(jù);responseXML屬性用于接收XML數(shù)據(jù)格式的響應(yīng)數(shù)據(jù)。
