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的无刷新分页技术
Jun 11 Javascript
jquery 判断滚动条到达了底部和顶端的方法
Apr 02 Javascript
jQuery实现视频作为全屏幕背景
Dec 18 Javascript
javascript实现日期时间动态显示示例代码
Sep 08 Javascript
第五篇Bootstrap 排版
Jun 21 Javascript
layui选项卡效果实现代码
May 19 Javascript
vue 设置路由的登录权限的方法
Jul 03 Javascript
详解Angular6 热加载配置方案
Aug 18 Javascript
浅谈Javascript中的对象和继承
Apr 19 Javascript
详解Vue调用手机相机和相册以及上传
May 05 Javascript
Vue使用axios出现options请求方法
May 30 Javascript
Vue SPA 初次进入加载动画实现代码
Nov 14 Javascript
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
一个php导出oracle库的php代码
2009/04/20 PHP
php下将多个数组合并成一个数组的方法与实例代码
2011/02/03 PHP
解析将多维数组转换为支持curl提交的一维数组格式
2013/07/08 PHP
求帮忙修改个php curl模拟post请求内容后并下载文件的解决思路
2015/09/20 PHP
Area 区域实现post提交数据的js写法
2014/04/22 Javascript
javascript中call和apply的用法示例分析
2015/04/02 Javascript
在Python中使用glob模块查找文件路径的方法
2015/06/17 Javascript
浅谈JavaScript超时调用和间歇调用
2015/08/30 Javascript
AngularJS入门教程之迭代器过滤详解
2016/08/18 Javascript
巧用Javascript的逻辑运算符
2016/12/02 Javascript
js数组去重的hash方法
2016/12/22 Javascript
基于jQuery选择器之表单对象属性筛选选择器的实例
2017/09/19 jQuery
JS随机数产生代码分享
2018/02/24 Javascript
微信小程序如何使用canvas二维码保存至手机相册
2019/07/15 Javascript
vue 使用element-ui中的Notification自定义按钮并实现关闭功能及如何处理多个通知
2019/08/17 Javascript
JavaScript判断浏览器版本的方法
2019/11/03 Javascript
vue实现表格合并功能
2020/12/01 Vue.js
python实现数通设备tftp备份配置文件示例
2014/04/02 Python
Python功能键的读取方法
2015/05/28 Python
Python网络编程之TCP与UDP协议套接字用法示例
2018/02/02 Python
python互斥锁、加锁、同步机制、异步通信知识总结
2018/02/11 Python
对python特殊函数 __call__()的使用详解
2019/07/02 Python
python实现简单飞行棋
2020/02/06 Python
python ImageDraw类实现几何图形的绘制与文字的绘制
2020/02/26 Python
英国的一家创新礼品和小工具零售商:Menkind
2019/08/24 全球购物
COSETTE官网:奢华,每天
2020/03/22 全球购物
英国森林假期:Forest Holidays
2021/01/01 全球购物
EJB发布WEB服务一般步骤
2012/10/31 面试题
百度JavaScript笔试题
2015/01/15 面试题
女大学生个人求职信
2013/12/09 职场文书
计算机专业职业规划
2014/02/28 职场文书
汽修专业自荐信
2014/07/07 职场文书
项目验收申请报告
2015/05/15 职场文书
婚宴致辞
2015/07/28 职场文书
python-opencv 中值滤波{cv2.medianBlur(src, ksize)}的用法
2021/06/05 Python
mysql数据库如何转移到oracle
2022/12/24 MySQL