為您解惑:jQuery中$.getJSON( )的使用方法簡介之獲取JSON格式的資料.........
阿新 • • 發佈:2019-02-19
jQuery中的$.getJSON( )方法函式主要用來從伺服器載入json編碼的資料,它使用的是GET HTTP請求。
使用方法:$.getJSON( url [, data ] [, success(data, textStatus, XHR) ] )
url是必選引數,表示json資料的地址即傳送的請求;
data是可選引數,用於請求資料時傳送的資料引數;
success是可選引數,這是一個回撥函式,用於請求成功時處理請求到的資料。
額外的引數:
data(response) - 包含來自請求的結果資料(物件)
texyStatus(status) - 包含請求的狀態
XHR(xhr) - 包含 XMLHttpRequest 物件
此函式相當於簡寫的ajax()函式:
<span style="font-size:14px;">$.ajax({
url: url,
data: data,
success: callback,
dataType: json
});</span>
例項如下:
a. json檔案可以儲存為“test.json”這樣的檔案,json資料的一般格式如下(“{ }”中的為物件,“[ ]”中的為陣列):
<span style="font-size:14px;">{ "total":3, "rows":[ { "userId":1, "realName":"張梅", "headUrl":"href='teacherDetail.html'", "img":"src='images/teacher.jpg'", "introduction":"熱情大方。" },{ "userId":2, "realName":"張三", "headUrl":"href='teacherDetail.html'", "img":"src='images/teacher.jpg'", "introduction":"熱情大方。" },{ "userId":3, "realName":"李斯", "headUrl":"href='teacherDetail.html'", "img":"src='images/teacher.jpg'", "introduction":"熱情大方" } ] }</span>
b. 通過$.getJSON獲取以上json資料:
<span style="font-size:14px;">$.getJSON('test.json', function(data){
for (var i = 0; i < data.rows.length; i++) {
$('#test').append('<p>' + data.rows[i].realName + '</p>');
}
});</span>
PS:更多JSON檔案解析連結:
(1)http://www.jb51.net/article/19366.htm
(2)http://www.jb51.net/article/36678.htm