收集json解析的四种方法分享


Posted in Javascript onJanuary 17, 2014

Json在Web开发的用处非常广泛,作为数据传递的载体,如何解析Json返回的数据是非常常用的。下面介绍下四种解析Json的方式:

Part 1

var list1 = [1,3,4];
alert(list1[1]);
var list2 = [{"name":"leamiko","xing":"lin"}];
alert(list2[0]["xing"])
alert(list2[0].xing)

Part 2

var value = {
    "china":{
        "hangzhou":{"item":"1"},
        "shanghai":{"item":"2"},
        "chengdu":{"item":"3"}
    },
    "America":{
        "aa":{"item":"1"},
        "bb":{"item":"2"}   
    },
    "Spain":{
        "dd":{"item":"1"},
        "ee":{"item":"2"},
        "ff":{"item":"3"}   
    }
};
for(var countryObj in value)
{
    document.write(countryObj + ":<br />")
    //没用的for(var cityObj in value.countryObj)
    for(var cityObj in value[countryObj])
    {
        document.write('    ' + cityObj + "<br />");
        for(var itemObj in value[countryObj][cityObj])
        {
            document.write("      "+ itemObj + value[countryObj][cityObj][itemObj] +"<br />")   
        }
    }   
}  

解释:

countryObj 为value对象的一个属性明,value[countryObj] 为value对象的属性值 这里为一个json对象比如b,value[countryObj][cityObj]为josn对象b的属性值 它也是一个json对象,于是 value[countryObj][cityObj]["item"]便可以取到json对象暂时成为c的值,或者 value[countryObj][cityObj].item。

总之分清是json还是array这是很关键的。

Part 3

var value2 = {
    "china":[
        {"name":"hangzhou", "item":"1"},
        {"name":"shanghai", "item":"2"},
        {"name":"sichuan", "item":"3"}
    ],
    "America":[
        {"name":"aa", "item":"12"},
        {"name":"bb", "item":"2"}
    ],
    "Spain":[
        {"name":"cc", "item":"1"},
        {"name":"dd", "item":"23"},
        {"name":"ee", "item":"3"}
    ]
};
for (var countryObj in value2)
{
    document.write(countryObj + ":<br />")   
    for (var cityObj in value2[countryObj])
    {
        //可以用document.write("  " + value2[countryObj][cityObj].item + "<br />");
        document.write(cityObj + "  " + value2[countryObj][cityObj]["name"] + "<br />" );   
    }
}

解释:

countryObj 为value2对象的属性名,value2[countryObj] 为value2对象属性值 在本例中它是一个数组,cityObj 是数组的一个元素,它又是另外一个json对象,于是,value2[countryObj][cityObj]["name"]就访问到该对象的 name的属性值,也可以通过 value2[countryObj][cityObj].name 来访问该属性值。

Part 4

var value2 = {
    "china":[
        {"name":"hangzhou", "item":"1"},
        {"name":"shanghai", "item":"2"},
        {"name":"sichuan", "item":"3"}
    ],
    "America":[
        {"name":"aa", "item":"12"},
        {"name":"bb", "item":"2"}
    ],
    "Spain":[
        {"name":"cc", "item":"1"},
        {"name":"dd", "item":"23"},
        {"name":"ee", "item":"3"}
    ]
};    for (var countryObj in value2)
    {
        document.write(countryObj + ":<br />")   
        //document.write("  " + value2[countryObj].length);
        for (var i = 0;i < value2[countryObj].length; i++)
        {
            document.write("  " + value2[countryObj][i]["name"] + "<br />");   
        }
    }

解释:

countryObj value2对象的属性名,value2[countryObj] 属性值 本例中是一个数组,value2[countryObj].length 数组的长度,value2[countryObj][i]数组的项 == json对象。

value2[countryObj][i]["name"] 取得name的值,也可以用value2[countryObj][i].name 来取得name的值。

Javascript 相关文章推荐
js动态为代码着色显示行号
May 29 Javascript
JS记录用户登录次数实现代码
Jan 15 Javascript
Jquery中的层次选择器与find()的区别示例介绍
Feb 20 Javascript
详解JavaScript的Polymer框架中的通知交互
Jul 29 Javascript
详解JavaScript中的4种类型识别方法
Sep 14 Javascript
jQuery实现的右下角广告窗体跟随效果示例
Sep 16 Javascript
Node.js包管理器Yarn的入门介绍与安装
Oct 17 Javascript
Javascript中call,apply,bind方法的详解与总结
Dec 12 Javascript
详解webpack+angular2开发环境搭建
Jun 28 Javascript
bootstrap switch开关组件使用方法详解
Aug 22 Javascript
Js代码中的span拼接问题解决
Nov 22 Javascript
带你使用webpack快速构建web项目的方法
Nov 12 Javascript
javascript在子页面中函数无法调试问题解决方法
Jan 17 #Javascript
ie7+背景透明文字不透明超级简单的实现方法
Jan 17 #Javascript
用js控制组织结构图可以任意拖拽到指定位置
Jan 17 #Javascript
Jquery 获取对象的几种方式介绍
Jan 17 #Javascript
在javascript中如何得到中英文混合字符串的长度
Jan 17 #Javascript
JS阻止冒泡事件以及默认事件发生的简单方法
Jan 17 #Javascript
Js判断CSS文件加载完毕的具体实现
Jan 17 #Javascript
You might like
php foreach正序倒序输出示例代码
2014/07/01 PHP
详解PHP实现执行定时任务
2015/12/21 PHP
PHP数组操作简单案例分析
2016/10/15 PHP
浅谈php数组array_change_key_case() 函数和array_chunk()函数
2016/10/22 PHP
PHP版单点登陆实现方案的实例
2016/11/17 PHP
javascript两段代码,两个小技巧
2010/02/04 Javascript
JS将数字转换成三位逗号分隔的样式(示例代码)
2014/02/19 Javascript
js简单的弹出框有关闭按钮
2014/05/05 Javascript
javascript中Object使用详解
2015/01/26 Javascript
浅谈jquery设置和获得checkbox选中的问题
2016/08/19 Javascript
基于JS实现仿百度百家主页的轮播图效果
2017/03/06 Javascript
ES6新特性之变量和字符串用法示例
2017/04/01 Javascript
浅谈Node模块系统及其模式
2017/11/17 Javascript
Vue实现点击后文字变色切换方法
2018/02/11 Javascript
SVG实现时钟效果
2018/07/17 Javascript
CKEditor4配置与开发详细中文说明文档
2018/10/08 Javascript
JS正则表达式封装与使用操作示例
2019/05/15 Javascript
详解elementui之el-image-viewer(图片查看器)
2019/08/30 Javascript
element 中 el-menu 组件的无限极循环思路代码详解
2020/04/26 Javascript
Python编程使用NLTK进行自然语言处理详解
2017/11/16 Python
Python判断有效的数独算法示例
2019/02/23 Python
pyftplib中文乱码问题解决方案
2020/01/11 Python
pytorch读取图像数据转成opencv格式实例
2020/06/02 Python
Python 的 f-string 可以连接字符串与数字的原因解析
2021/02/20 Python
伦敦剧院门票:From The Box Office
2018/06/30 全球购物
高中数学教师求职信
2013/10/30 职场文书
教师求职推荐信范文
2013/11/20 职场文书
应付会计岗位职责
2013/12/12 职场文书
感恩父母的演讲稿
2014/05/06 职场文书
老干部工作先进集体事迹材料
2014/05/21 职场文书
局火灾防控工作方案
2014/05/25 职场文书
2014年最新个人对照检查材料范文
2014/09/25 职场文书
售后服务质量承诺书
2015/04/29 职场文书
公司车辆维修管理制度
2015/08/05 职场文书
Python合并多张图片成PDF
2021/06/09 Python
Python中文纠错的简单实现
2021/07/07 Python