jQuery JSON的解析方式分享


Posted in Javascript onApril 05, 2011

等到问题解决了,也大致明白怎么个意思了,归根结底还是对jquery对相关json对象获取的理解有所偏差。
这里考虑都考虑的是服务器返回的是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方法为例说明数据处理方法:
这里特别需要注意的是方式1中的eval()方法是动态执行其中字符串(可能是js脚本)的,这样很容易会造成系统的安全问题。所以可以采用一些规避了eval()的第三方客户端脚本库,比如JSON in JavaScript就提供了一个不超过3k的脚本库。
Javascript 相关文章推荐
腾讯的ip接口 方便获取当前用户的ip地理位置
Nov 25 Javascript
javascript 弹出窗口中是否显示地址栏的实现代码
Apr 14 Javascript
JavaScript计算两个日期时间段内日期的方法
Mar 16 Javascript
JavaScript调用客户端Java程序的方法
Jul 27 Javascript
Javascript中的Prototype到底是什么
Feb 16 Javascript
jQuery.form.js插件不能解决连接超时(timeout)的原因分析及解决方法
Oct 14 Javascript
js/jq仿window文件夹移动/剪切/复制等操作代码
Mar 08 Javascript
jquery easyui如何实现格式化列
Jul 30 jQuery
解析vue中的$mount
Dec 21 Javascript
Vue+ElementUI项目使用webpack输出MPA的方法
Aug 27 Javascript
layui table复选框禁止某几条勾选的实例
Sep 20 Javascript
js中apply和call的理解与使用方法
Nov 27 Javascript
jQuery 1.5 源码解读 面向中高阶JSER
Apr 05 #Javascript
基于jquery的动态创建表格的插件
Apr 05 #Javascript
基于jquery的合并table相同单元格的插件(精简版)
Apr 05 #Javascript
新鲜出炉的js tips提示效果
Apr 03 #Javascript
使用Firebug对js进行断点调试的图文方法
Apr 02 #Javascript
dreamweaver 安装Jquery智能提示
Apr 02 #Javascript
jquery 读取页面load get post ajax 四种方式代码写法
Apr 02 #Javascript
You might like
详解PHP中的PDO类
2015/07/06 PHP
基于PHP实现堆排序原理及实例详解
2020/06/19 PHP
扩展JS Date对象时间格式化功能的小例子
2013/12/02 Javascript
js实现感应鼠标图片透明度变化的方法
2015/02/20 Javascript
分享我的jquery实现下拉菜单心的
2015/11/29 Javascript
微信小程序 Windows2008 R2服务器配置TLS1.2方法
2016/12/05 Javascript
详解javascript表单的Ajax提交插件的使用
2016/12/29 Javascript
使用微信内嵌H5网页解决JS倒计时失效问题
2017/01/13 Javascript
基于axios封装fetch方法及调用实例
2018/02/05 Javascript
JS与SQL方式随机生成高强度密码示例
2018/12/29 Javascript
JavaScript使用小插件实现倒计时的方法讲解
2019/03/11 Javascript
在antd Form表单中select设置初始值操作
2020/11/02 Javascript
[05:35]DOTA2英雄梦之声_第13期_拉比克
2014/06/21 DOTA
Python2.7简单连接与操作MySQL的方法
2016/04/27 Python
解析Python中的eval()、exec()及其相关函数
2017/12/20 Python
python简单商城购物车实例代码
2018/03/15 Python
解决matplotlib库show()方法不显示图片的问题
2018/05/24 Python
Python爬虫文件下载图文教程
2018/12/23 Python
使用pandas把某一列的字符值转换为数字的实例
2019/01/29 Python
python3实现小球转动抽奖小游戏
2020/04/15 Python
python中的subprocess.Popen()使用详解
2019/12/25 Python
python pptx复制指定页的ppt教程
2020/02/14 Python
xadmin使用formfield_for_dbfield函数过滤下拉表单实例
2020/04/07 Python
自主招生自荐信范文
2013/12/04 职场文书
咖啡店的创业计划书,让你hold不住
2014/01/03 职场文书
农民工创业典型事迹
2014/01/25 职场文书
党校培训自我鉴定
2014/02/01 职场文书
企业晚会策划方案
2014/05/29 职场文书
村委会贫困证明范本
2014/09/17 职场文书
节约用电通知
2015/04/25 职场文书
安全生产感想
2015/08/07 职场文书
电力安全教育培训心得体会
2016/01/11 职场文书
创业计划书之家政服务
2019/09/18 职场文书
导游词之新疆尼雅遗址
2019/10/16 职场文书
详解Java ES多节点任务的高效分发与收集实现
2021/06/30 Java/Android
react中的DOM操作实现
2021/06/30 Javascript