JQuery 解析多维的Json数据格式


Posted in Javascript onNovember 02, 2009

这就要利用到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的读取也是类似~~
如有不当之处请指正,谢谢!!
Javascript 相关文章推荐
jQuery Tools tab使用介绍
Jul 14 Javascript
Jquery实现显示和隐藏的4种简单方式
Aug 28 Javascript
jQuery实现点击该行即可删除HTML表格行
Oct 17 Javascript
JQuery实现简单的图片滑动切换特效
Nov 22 Javascript
D3.js实现饼状图的方法详解
Sep 21 Javascript
jQuery 插件封装的方法
Nov 16 Javascript
JavaScript制作简易计算器(不用eval)
Feb 05 Javascript
node.js实现回调的方法示例
Mar 01 Javascript
layui文件上传实现代码
May 20 Javascript
使用vue2实现购物车和地址选配功能
Mar 29 Javascript
Web安全之XSS攻击与防御小结
Dec 13 Javascript
浅谈vue2的$refs在vue3组合式API中的替代方法
Apr 18 Vue.js
javascript(jquery)利用函数修改全局变量的代码
Nov 02 #Javascript
一个可以兼容IE FF的加为首页与加入收藏实现代码
Nov 02 #Javascript
JS OOP包机制,类创建的方法定义
Nov 02 #Javascript
JQuery 网站换肤功能实现代码
Nov 02 #Javascript
Javascript结合css实现网页换肤功能
Nov 02 #Javascript
cnblogs csdn 代码运行框实现代码
Nov 02 #Javascript
键盘 keycode的值 javascript时触发事件时很有用的要素
Nov 02 #Javascript
You might like
php计算两个文件相对路径的方法
2015/03/14 PHP
在WordPress中使用wp-cron插件来设置定时任务
2015/12/10 PHP
Yii2框架数据库简单的增删改查语法小结
2016/08/31 PHP
PHP simplexml_load_file()函数讲解
2019/02/03 PHP
JavaScript按位运算符的应用简析
2014/02/04 Javascript
Iframe 自动适应页面的高度示例代码
2014/02/26 Javascript
浅谈JSON和JSONP区别及jQuery的ajax jsonp的使用
2014/11/23 Javascript
JQuery的ON()方法支持的所有事件罗列
2015/02/28 Javascript
jquery.validate使用时遇到的问题
2015/05/25 Javascript
根据user-agent判断蜘蛛代码黑帽跳转代码(js版与php版本)
2015/09/14 Javascript
Jquery 全选反选实例代码
2015/11/19 Javascript
jquery-mobile表单的创建方法详解
2016/11/23 Javascript
JS实现本地存储信息的方法(基于localStorage与userData)
2017/02/18 Javascript
打字效果动画的4种实现方法(超简单)
2017/10/18 Javascript
手动用webpack搭建第一个ReactApp的示例
2018/04/11 Javascript
Vue 开发必须知道的36个技巧(小结)
2019/10/09 Javascript
NodeJS实现一个聊天室功能
2019/11/25 NodeJs
[01:24:34]2014 DOTA2华西杯精英邀请赛5 24 DK VS LGD
2014/05/25 DOTA
[33:28]完美世界DOTA2联赛PWL S3 PXG vs GXR 第三场 12.19
2020/12/24 DOTA
python实现外卖信息管理系统
2018/01/11 Python
Python元字符的用法实例解析
2018/01/17 Python
Python实现合并同一个文件夹下所有txt文件的方法示例
2018/04/26 Python
Python3.6.2调用ffmpeg的方法
2019/01/10 Python
解决python中画图时x,y轴名称出现中文乱码的问题
2019/01/29 Python
通过实例学习Python Excel操作
2020/01/06 Python
OpenCV哈里斯(Harris)角点检测的实现
2020/01/15 Python
Python selenium模拟手动操作实现无人值守刷积分功能
2020/05/13 Python
HTML5中外部浏览器唤起微信分享
2020/01/02 HTML / CSS
Html5让容器充满屏幕高度或自适应剩余高度的布局实现
2020/05/14 HTML / CSS
澳大利亚领先的美容护肤品零售商之一:SkincareStore
2018/01/22 全球购物
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
社区活动邀请函范文
2014/01/29 职场文书
委托公证书
2014/04/08 职场文书
2014年教研活动总结范文
2014/04/26 职场文书
处级干部考察材料
2014/12/24 职场文书
为什么代码规范要求SQL语句不要过多的join
2021/06/23 MySQL