1. 程式人生 > >jQuery獲取json數據

jQuery獲取json數據

.html 內容 alt 代碼 http 集合 技術分享 通過 html

出自---小瓶子編輯

$.each()方法接受兩個參數,第一個是需要遍歷的對象集合(JSON對象集合),第二個是用來遍歷的方法,這個方法又接受兩個參數,第一個是遍歷的index,第二個是當前遍歷的值。哈哈,有了$.each()方法JSON的解析就迎刃而解咯。

function loadInfo() {
$.getJSON("loadInfo", function(data) {
$("#info").html("");//清空info內容
$.each(data.comments, function(i, item) {
$("#info").append(
"<div>" + item.id + "</div>" +
"<div>" + item.nickname + "</div>" +
"<div>" + item.content + "</div><hr/>");
});
});
}

正如上面,loadinfo是請求的地址,function(data){...}就是在請求成功後的回調函數,data封裝了返回的JSON對象,在下面的$.each(data.comments,function(i,item){...})方法中data.comments直接到達JSON數據內包含的JSON數組:

[{"content":"很不錯嘛","id":1,"nickname":"納尼"},{"content":"喲西喲西","id":2,"nickname":"小強"}]

$.each()方法中的function就是對這個數組進行遍歷,再通過操作DOM插入到合適的地方的。在遍歷的過程中,我們可以很方便的訪問當前遍歷index(代碼中的”i“)和當前遍歷的值(代碼中的”item“)。
結果如下:

技術分享

原文:http://www.cnblogs.com/codeplus/archive/2011/07/182109544.html

jQuery獲取json數據