JQuery 解析多维的Json数据格式

 更新时间:2009年11月02日 14:00:05   作者:  
对博客系统已经做到了博客评论模块部分了,对单篇博文进行静态化的同时对博文的评论部分采取AJAX的方式去读取。
这就要利用到JQuery,ASHX以及Json来合作了。一篇文章有多个评论,每十个为一页。用户每点击下一页则自动抓去下一页,这个过程采用无刷新放心进行。
Json格式其实和表格式有异曲同工之妙,在网络传输中,它比XML还省流量,而且与JS有更好的融合,更容易被解析。Json格式样例如下:
复制代码 代码如下:

{"Products":[
{"orderid":"11077","customerid":"RATTC"},
{"orderid":"11078","customerid":"RATT"}
],
"Img":[{"id":"12345","url"
:"image/1.jpg"}
]}

其中Products和Img我们可以认为是一张表的表名。在Products表中,orderid和customerid都是Products的字段,11077与RATTC可以理解为对应字段的值。Img部分也是一样。所以,上面Products存在两笔记录,而Img存在一笔记录而已。
那么我们怎么样在JQuery里面进行解析出相应的表,栏位和值呢?
在JQuery里面我们可以用:
var Products= Json.Products;
来获得对Products表的筛选。接下来我们就对Products进行循环读取值:
复制代码 代码如下:

$.each(Products, function(i, n) {
str += "<p id='xuhao'>" + n.orderid+ "ID" + n.customerid + "</p>";
});

$.each(Products, function(i, n) {} 这里的Products就是我们的目标Json数据中的表了了。i代表记录的顺序,从0开始(0代表第一笔,1代表第二笔...),而n就代表对应字段的值了。 对Img的读取也是类似~~
如有不当之处请指正,谢谢!!

相关文章

  • jQuery 使用手册(五)

    jQuery 使用手册(五)

    jQuery 使用手册,大家可以耐心的看完,就基本上入门了。
    2009-09-09
  • 解决自定义$(id)的方法与jquery选择器$冲突的问题

    解决自定义$(id)的方法与jquery选择器$冲突的问题

    最近网站改版,原来的js都是原生js,因为当前比较jquery而且他的组件也比较多,使用方便,所以我们也采用了jquery但跟原来的$(id)冲突,经过网络很多人的推荐我们选择了这个方法
    2014-06-06
  • jQuery操作元素追加内容示例

    jQuery操作元素追加内容示例

    这篇文章主要介绍了jQuery操作元素追加内容,结合完整实例形式分析了jquery页面元素追加相关操作方法,包括append、appendTo、prepend、prependTo等方法使用技巧,需要的朋友可以参考下
    2020-01-01
  • jquery实现红色竖向多级向右展开的导航菜单效果

    jquery实现红色竖向多级向右展开的导航菜单效果

    这篇文章主要介绍了jquery实现红色竖向多级向右展开的导航菜单效果,涉及jquery鼠标hover事件结合class样式动态添加与删除的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-08-08
  • jQuery控制文本框只能输入数字和字母及使用方法

    jQuery控制文本框只能输入数字和字母及使用方法

    这篇文章主要介绍了jQuery控制文本框只能输入数字和字母及使用方法的相关资料,非常不错而且实用性也很高,需要的朋友可以参考下
    2016-05-05
  • 使用Browserify配合jQuery进行编程的超级指南

    使用Browserify配合jQuery进行编程的超级指南

    这篇文章主要介绍了使用Browserify配合jQuery进行编程的超级指南,Browserify 可以让你使用类似于node的require()的方式来组织浏览器端的JavaScript代码,需要的朋友可以参考下
    2015-07-07
  • 谈谈对jquery ui tabs 的理解

    谈谈对jquery ui tabs 的理解

    本文给大家介绍jquery ui tabs的理解,包括属性、事件、方法和技巧等相关知识,对jquery ui tabs感兴趣的朋友一起学习吧
    2015-11-11
  • 使用jquery插件实现图片延迟加载技术详细说明

    使用jquery插件实现图片延迟加载技术详细说明

    有时我们看到一些大型网站,页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较长的页面来说,这个方案是比较好的。
    2011-03-03
  • EasyUI 数据表格datagrid列自适应内容宽度的实现

    EasyUI 数据表格datagrid列自适应内容宽度的实现

    这篇文章主要介绍了EasyUI 数据表格datagrid列自适应内容宽度的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-07-07
  • jQuery解决$符号命名冲突

    jQuery解决$符号命名冲突

    本文主要介绍jQuery中$符号命名冲突的解决方法,希望能帮到大家,有需要的朋友可以参考一下。
    2016-06-06

最新评论