首頁 > 網際網路

ajax怎麼獲取json資料並輸出

2019-12-12 17:58:40

在jquery中,可以通過getJSON()方法來獲得json資料,再使用each()方法遍歷json資料進行輸出。下面介紹實現的過程。

1

新建一個html檔案,命名為test.html,用於講解ajax怎麼獲取json資料並輸出。


2

在test.html中,使用script標籤載入jquery.min.js檔案,這是使用jquery方法的前提。


3

在test.html頁面中,建立一個button按鈕,用於實現點選通過ajax請求獲得json資料,在button下面再建立一個p元素,用於json資料的顯示。


4

新建一個檔名為ajax_json的js檔案,在檔案裡面建立一個json資料,如下圖:


5

在test.html頁面,給button系結click點選事件,當按鈕被點選時,使用getJSON方法獲得ajax_json.js裡面的json資料,同時通過function方法進行資料的輸出。


6

在function方法裡面,使用each()方法遍歷json資料的內容,並使用append()方法把json裡面的內容新增到p元素內。


7

在瀏覽器執行test.html檔案,點選「獲得JSON資料」按鈕,檢視返回的json資料資訊。




IT145.com E-mail:sddin#qq.com