jQuery获取json数据

Posted nelsonlei

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery获取json数据相关的知识,希望对你有一定的参考价值。

出自---小瓶子编辑

$.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数据的主要内容,如果未能解决你的问题,请参考以下文章

使用jquery从文件中获取JSON数据

使用ajax获取JSON数据的jQuery代码的格式

jQuery AJAX获取JSON数据

jquery ajax 怎样跨域获取 json 数据

尝试使用 jQuery 获取 JSON 数据时出现 TypeError

ASP.NET WebAPI和带有大型数据集的jQuery(json)