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 相关文章推荐
打开超链需要“确认”对话框的方法
Mar 08 Javascript
WEB高性能开发之疯狂的HTML压缩
Jun 19 Javascript
javascript深入理解js闭包
Jul 03 Javascript
javascript获取checkbox复选框获取选中的选项
Aug 12 Javascript
浅谈JavaScript function函数种类
Dec 29 Javascript
JavaScript蒙板(model)功能的简单实现代码
Aug 04 Javascript
switch语句的妙用(必看篇)
Oct 03 Javascript
ztree简介_动力节点Java学院整理
Jul 19 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
Jul 27 Javascript
vue+springboot前后端分离实现单点登录跨域问题解决方法
Jan 30 Javascript
JavaScript学习笔记之数组基本操作示例
Jan 09 Javascript
JS高级程序设计之class继承重点详解
Jul 07 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中file_exists函数使用详解
2015/05/08 PHP
PHP中Enum(枚举)用法实例详解
2015/12/07 PHP
PHP实现使用DOM将XML数据存入数组的方法示例
2017/09/27 PHP
使用laravel和ECharts实现折线图效果的例子
2019/10/09 PHP
laravel 解决Eloquent ORM的save方法无法插入数据的问题
2019/10/21 PHP
javascript 写类方式之二
2009/07/05 Javascript
20个非常棒的Jquery实用工具 国外文章
2010/01/01 Javascript
javascript+mapbar实现地图定位
2010/04/09 Javascript
过虑特殊字符输入的js代码
2010/08/05 Javascript
IE、FF、Chrome浏览器中的JS差异介绍
2013/08/13 Javascript
JS操作iframe里的dom(实例讲解)
2014/01/29 Javascript
jQuery操作表格(table)的常用方法、技巧汇总
2014/04/12 Javascript
js使用正则实现ReplaceAll全部替换的方法
2014/07/18 Javascript
Jquery使用val方法读写value值
2015/05/18 Javascript
Bootstrap安装环境配置教程分享
2016/05/27 Javascript
基于vue的fullpage.js单页滚动插件
2017/03/20 Javascript
微信小程序开发之好友列表字母列表跳转对应位置
2017/09/26 Javascript
vue 实现全选全不选的示例代码
2018/03/29 Javascript
vue-resourc发起异步请求的方法
2020/02/11 Javascript
VSCode launch.json配置详细教程
2020/06/18 Javascript
vue3弹出层V3Popup实例详解
2021/01/04 Vue.js
python控制台英汉汉英电子词典
2020/04/23 Python
Python for Informatics 第11章 正则表达式(一)
2016/04/21 Python
深入flask之异步非堵塞实现代码示例
2018/07/31 Python
pandas DataFrame索引行列的实现
2019/06/04 Python
python 等差数列末项计算方式
2020/05/03 Python
python根据用户需求输入想爬取的内容及页数爬取图片方法详解
2020/08/03 Python
pycharm实现猜数游戏
2020/12/07 Python
scrapy实践之翻页爬取的实现
2021/01/05 Python
HTML5手机端弹出遮罩菜单特效代码
2016/01/27 HTML / CSS
会计与出纳自荐书范文
2014/03/16 职场文书
2014年电厂个人工作总结
2014/11/27 职场文书
2014年妇幼保健工作总结
2014/12/08 职场文书
学校青年志愿者活动总结
2015/05/06 职场文书
告别网页搜索!教你用python实现一款属于自己的翻译词典软件
2021/06/03 Python
PYTHON使用Matplotlib去实现各种条形图的绘制
2022/03/22 Python