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 相关文章推荐
fromCharCode和charCodeAt 方法
Dec 27 Javascript
添加到收藏夹代码(兼容几乎所有的浏览器)
Jan 09 Javascript
JS正则表达式获取分组内容的方法详解
Nov 15 Javascript
jQuery+ajax实现鼠标单击修改内容的思路
Jun 29 Javascript
JS验证逗号隔开可以是中文字母数字
Apr 22 Javascript
javascript的BOM
May 03 Javascript
微信小程序(应用号)简单实例应用及实例详解
Sep 26 Javascript
最全正则表达式总结:验证QQ号、手机号、Email、中文、邮编、身份证、IP地址等
Aug 16 Javascript
基于vue2.0实现简单轮播图
Nov 27 Javascript
JavaScript Math对象和调试程序的方法分析
May 13 Javascript
vscode调试node.js的实现方法
Mar 22 Javascript
用JS实现飞机大战小游戏
Jun 09 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使用pdo连接mssql server数据库实例
2014/12/25 PHP
PHP针对JSON操作实例分析
2015/01/12 PHP
PHP加密解密实例分析
2015/12/25 PHP
laravel框架创建授权策略实例分析
2019/11/22 PHP
使用Modello编写JavaScript类
2006/12/22 Javascript
javascript-TreeView父子联动效果保持节点状态一致
2007/08/12 Javascript
ExtJs默认的字体大小改变的几种方法(自己整理)
2013/04/18 Javascript
一个JS的日期格式化算法示例
2013/07/31 Javascript
jquery parent和parents的区别分析
2013/10/02 Javascript
js日期对象兼容性的处理方法
2014/01/28 Javascript
javascript异步编程代码书写规范Promise学习笔记
2015/02/11 Javascript
AngularJS实现单独作用域内的数据操作
2016/09/05 Javascript
用js写的一个路由(简单实例)
2016/09/24 Javascript
通过Ajax使用FormData对象无刷新上传文件方法
2016/12/08 Javascript
nodejs中模块定义实例详解
2017/03/18 NodeJs
vue-cli 组件的导入与使用教程详解
2018/04/11 Javascript
web页面和微信小程序页面实现瀑布流效果
2018/09/26 Javascript
seajs和requirejs模块化简单案例分析
2019/08/26 Javascript
Python常用的文件及文件路径、目录操作方法汇总介绍
2015/05/21 Python
Python基于tkinter模块实现的改名小工具示例
2017/07/27 Python
python3将视频流保存为本地视频文件
2018/06/20 Python
python rsync服务器之间文件夹同步脚本
2019/08/29 Python
vue学习笔记之动态组件和v-once指令简单示例
2020/02/29 Python
使用PyQt5实现图片查看器的示例代码
2020/04/21 Python
详解python tkinter 图片插入问题
2020/09/03 Python
Matplotlib中rcParams使用方法
2021/01/05 Python
Python中lru_cache的使用和实现详解
2021/01/25 Python
CSS3中的transform属性进行2D和3D变换的基本用法
2016/05/12 HTML / CSS
TripAdvisor日本:全球领先的旅游网站
2019/02/14 全球购物
园林资料员岗位职责
2013/12/30 职场文书
2014年公司植树节活动方案
2014/03/04 职场文书
法定代表人资格证明书
2015/06/18 职场文书
Redis 中使用 list,streams,pub/sub 几种方式实现消息队列的问题
2022/03/16 Redis
Nginx流量拷贝ngx_http_mirror_module模块使用方法详解
2022/04/07 Servers
Python爬虫 简单介绍一下Xpath及使用
2022/04/26 Python
python数字图像处理之对比度与亮度调整示例
2022/06/28 Python