我们都知道现在Ajax盛行,而且前后台数据交流的格式已经换成了JSON了。虽然我对这种做法还是有点担忧的,如果用户关闭了JavaScript怎么办?但是这些担忧还是不能阻止Ajax的盛行和JSON数据交流格式的流行。之前只知道JSON是一种键值对格式的数据格式,但是也没有怎么深入去了解,也没有做到这次这样一层一层嵌套足有3级之多的情况。
言归正传,我们先来看看JSON是什么鬼?
JSON:JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它基于JavaScript(Standard ECMA-262 3rd Edition - December 1999)的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。这些特性使JSON成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成(网络传输速度)。
从上面就不难看出JSON的优点了,之前很喜欢用POST和GET的童鞋也注意一下,JSON比起页面提交的优点:
- 只对有用的数据进行封装传输。而传统的提交基本上是一个form整个扔到后台去慢慢读,从这里可以看出第一点首先是数据传输量的降低。
- 第二个优点则是JSON是一种与平台无关的数据传输格式,你在JSP可以用,我在ASP.NET也可以用,万金油的格式,而且现在很多后台都用JSON传输数据。
看到JSON这么好用,估计也是JSON流行的原因之一了,简单粗暴。简单的学习请看W3Shool的简单教程:
接下来是我自己做的一个解析3级JSON的例子,不废话直接贴图:
额,因为用到了JQuery和JQuery的JSON控制库,所以最好还是下载demo直接看比较好:
或者你已经有了这两个库,也可以直接拷贝下面代码:
志愿报名系统
其实我们不难看出来就是不停地往页面下面读取数据而已,这也是因为被我自己定的页面结构所限制了。因为要配合这样的页面结构,所以不得不用很繁杂的下级读取。
再来说下JSON的多级读取问题:
首先是JQuery的迭代方法,$.each(),详细的用法请看:mabel_on_line的
其次是对JSON格式的解析,需要将原来的对象转化成字符串,这里我推荐的是:石曼迪分享
例子中我用的解析JSON字符串的方法是eval方法,也是原生JS内置的方法,个人觉得比起框架的原生的会稳定的多。
纯属自虐行为,如果有更好更方便的解析多级JSON的方法请留言告诉我,thanks!