原生jsAJAX簡介

2021-10-10 13:55:26 字數 2263 閱讀 4716

建立乙個請求物件

;由此ajax請求物件已經建立完成,我們可以看一下列印結果

由此可見,該物件中有很多屬性和方法,接下來我們就會用到其中的一些屬性和方法。

2. 呼叫open方法

該步驟的作用是設定請求方式和請求路徑。

該open方法有兩個引數

引數1:請求的方式,常見的有get和post兩種請求方式

引數2:請求的路徑,也就是api的位址

xhr.

open

("get"

,"");

設定請求頭

如果請求方式是post需要設定請求頭,如果是get則不需要設定。此例中我們使用的是get請求方式所以不用設定請求頭,但為了步驟的完整以作補充。

xhr.

setrequestheader

("content-type",)

;

xhr.

onreadystatechange

=function()

}

上面的操作就是當請求完成後列印返回的結果

5. 傳送請求

xhr.

send()

;

該方法如果是post請求方式需要傳參,如果是get則不需要

引數:請求時需要傳入的引數,以api的要求為準。

以上便是此次請求返回的內容,該內容為json字串。返回的結果通常有兩種型別,xml和json。接下來便介紹者兩種型別

json是一種用於各種程式語言之間交流的一種資料格式,通常是字串。

json資料的最外面需要用或{}包起來。

json資料的屬性名需要使用"「括起來,屬性值如果是字串型別也需要使用」"括起來。

json資料可以轉換成js物件,使用起來更方便,那麼怎麼轉換呢

json.parse()可以將json字串轉換成js物件

該方法的引數是json字串,如果傳入的引數不是json字串會報錯,也可以用來判斷乙個字串是否是json字串。

接下來,將我們得到的字串轉換成js物件

此時,已經轉換成我們熟悉的js物件了。

此外,我們也可以將js物件轉換為json格式

json.stringify()可以將js物件轉換為json格式

引數:js物件

var obj =

console.

log(

json

.stringify

(obj)

);

xml是用於各種語言交流的一種資料型別。

xml使用雙標籤的形式記錄資料

必須要有根標籤

可以不寫文件宣告,如果有文件宣告必須是在文件的第一行

標籤可以自定義

將xml字串轉換為xml物件

建立轉換物件

var parser =

newdomparse()

;

呼叫轉換方法

parsefromstring()能夠將xml字串轉換為xml物件,需要傳入兩個引數

引數1:要轉換的內容

引數2:要轉換的型別,一般為text/xml

此時,已經轉換為xml物件。

原生JS Ajax請求

傳統的web互動是使用者觸發乙個http請求伺服器,然後伺服器收到之後,在做出響應到使用者,並且返回乙個新的頁面,每當伺服器處理客戶端提交的請求時,客戶都只能空閒等待,並且哪怕只是一次很小的互動 只需從伺服器端得到很簡單的乙個資料,都要返回乙個完整的html頁,而使用者每次都要浪費時間和頻寬去重新讀...

原生js ajax 封裝

首先我們先了解ajax的get和post請求分別是怎樣請求資料的 get請求 建立ajax例項 開啟需要請求的位址,可以有三個引數 參1 請求方式 參3 是否非同步,可選,預設非同步 向後端傳送的資料,get方式用不到 ajx.onreadystatechange post請求 建立ajax例項 開...

原生js ajax分頁元件

定義分頁元件dom pagination class pagination div 定義分頁元件類及例項方法 分頁元件類 function pagination ref 給例項物件新增公共屬性和方法 pagination.prototype else li.innerhtml item this.u...