jquery JSON的解析方式示例介绍


Posted in Javascript onJuly 27, 2014

这里考虑都考虑的是服务器返回的是JSON形式的字符串的形式,对于利用JSONObject等插件封装的JSON对象,与此亦是大同小异,这里不再做说明。

这里首先给出JSON字符串集,字符串集如下:

var data=" 
{ 
root: 
[ 
{name:'1',value:'0'}, 
{name:'6101',value:'西安市'}, 
{name:'6102',value:'铜川市'}, 
{name:'6103',value:'宝鸡市'}, 
{name:'6104',value:'咸阳市'}, 
{name:'6105',value:'渭南市'}, 
{name:'6106',value:'延安市'}, 
{name:'6107',value:'汉中市'}, 
{name:'6108',value:'榆林市'}, 
{name:'6109',value:'安康市'}, 
{name:'6110',value:'商洛市'} 
] 
}";

 这里以jquery异步获取的数据类型——json对象和字符串为依据,分别介绍两种方式获取到的结果处理方式。

1.对于服务器返回的JSON字符串,如果jquery异步请求没做类型说明,或者以字符串方式接受,那么需要做一次对象化处理,方式不是太麻烦,就是将该字符串放于eval()中执行一次。这种方式也适合以普通javascipt方式获取json对象,以下举例说明:

var dataObj=eval("("+data+")");//转换为json对象 
alert(dataObj.root.length);//输出root的子对象数量 
$.each(dataObj.root,fucntion(idx,item){ 
if(idx==0){ 
return true; 
} 

//输出每个root子对象的名称和值 
alert("name:"+item.name+",value:"+item.value); 
})

注:对于一般的js生成json对象,只需要将$.each()方法替换为for语句即可,其他不变。

2.对于服务器返回的JSON字符串,如果jquery异步请求将type(一般为这个配置属性)设为“json”,或者利用$.getJSON()方法获得服务器返回,那么就不需要eval()方法了,因为这时候得到的结果已经是json对象了,只需直接调用该对象即可,这里以$.getJSON方法为例说明数据处理方法:

$.getJSON("http://gaoyusi.blog.163.com/",{param:"gaoyusi"},function(data){

//此处返回的data已经是json对象 
//以下其他操作同第一种情况 
$.each(data.root,function(idx,item){ 
if(idx==0){ 
return true;//同countinue,返回false同break 
} 

alert("name:"+item.name+",value:"+item.value); 

}); 
});
Javascript 相关文章推荐
JQuery获取各种宽度、高度(format函数)实例
Mar 04 Javascript
JS:window.onload的使用介绍
Nov 13 Javascript
javascript实现可拖动变色并关闭层窗口实例
May 15 Javascript
谈一谈javascript闭包
Jan 28 Javascript
从零学习node.js之express入门(六)
Feb 25 Javascript
如何理解Vue的.sync修饰符的使用
Aug 17 Javascript
详解vue静态资源打包中的坑与解决方案
Feb 05 Javascript
jQuery实现输入框的放大和缩小功能示例
Jul 21 jQuery
Vue 列表上下过渡效果的实例代码
Jun 25 Javascript
Android 自定义view仿微信相机单击拍照长按录视频按钮
Jul 19 Javascript
vue页面更新patch的实现示例
Mar 25 Javascript
Vue 打包的静态文件不能直接运行的原因及解决办法
Nov 19 Vue.js
jQuery提交多个表单的小技巧
Jul 27 #Javascript
用javascript对一个json数组深度赋值示例
Jul 27 #Javascript
在JS数组特定索引处指定位置插入元素
Jul 27 #Javascript
多个$(document).ready()的执行顺序实例分析
Jul 26 #Javascript
jquery 取子节点及当前节点属性值
Jul 25 #Javascript
jquery text()方法取标签中的文本
Jul 25 #Javascript
jquery根据属性和index来查找属性值并操作
Jul 25 #Javascript
You might like
在字符串中把网址改成超级链接
2006/10/09 PHP
php 远程关机操作的代码
2008/12/05 PHP
PHP 操作文件的一些FAQ总结
2009/02/12 PHP
使用GROUP BY的时候如何统计记录条数 COUNT(*) DISTINCT
2011/04/23 PHP
Window 7/XP 安装Apache 2.4与PHP 5.4 的过程详解
2013/06/02 PHP
php发送post请求函数分享
2014/03/06 PHP
PHP数据库操作Helper类完整实例
2016/05/11 PHP
PHP7新增运算符用法实例分析
2016/09/26 PHP
Laravel框架处理用户的请求操作详解
2019/12/20 PHP
再次分享18个非常棒的jQuery表格插件
2011/04/10 Javascript
jquery+json实现数据列表分页示例代码
2013/11/15 Javascript
JS中FRAME的操作问题实例分析
2014/10/21 Javascript
jQuery实现为图片添加镜头放大效果的方法
2015/06/25 Javascript
AngularJS实现分页显示数据库信息
2016/07/01 Javascript
JavaScript每天必学之事件
2016/09/18 Javascript
javascript加载xml 并解析各节点的值(实现方法)
2016/10/12 Javascript
jquery实现文本框的禁用和启用
2016/12/07 Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
2018/07/26 Javascript
vuex 中插件的编写案例解析
2019/06/10 Javascript
VSCode Vue开发推荐插件和VSCode快捷键(小结)
2020/08/08 Javascript
jQuery实现简单QQ聊天框
2020/08/27 jQuery
python3.5使用tkinter制作记事本
2016/06/20 Python
Python实现带百分比的进度条
2016/06/28 Python
Python 调用Java实例详解
2017/06/02 Python
python 获取图片分辨率的方法
2019/01/08 Python
pycharm的console输入实现换行的方法
2019/01/16 Python
Python3网络爬虫开发实战之极验滑动验证码的识别
2019/08/02 Python
小米官方旗舰店:Xiaomi
2020/08/07 全球购物
2014全国两会学习心得体会2000字
2014/03/10 职场文书
青年文明号创建承诺
2014/03/31 职场文书
2014预备党员党课学习心得范文
2014/07/08 职场文书
纪律教育月活动总结
2014/08/26 职场文书
工程技术负责人岗位职责
2015/04/13 职场文书
办公室管理规章制度
2015/08/04 职场文书
2016年乡镇七一建党节活动总结
2016/04/05 职场文书
《成长的天空》读后感3篇
2019/12/06 职场文书