遍历json获得数据的几种方法小结


Posted in Javascript onJanuary 21, 2017

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"} 
  ] 
};<BR>  
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的值。

当一个人找不到出路的时候,最好的办法就是将当前能做好的事情做到极致,做到无人能及。

以上这篇遍历json获得数据的几种方法小结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery实现鼠标拖动图片效果示例代码
Jan 09 Javascript
javascript中的正则表达式使用指南
Mar 01 Javascript
XML文件转化成NSData对象的方法
Aug 12 Javascript
JQuery点击事件回到页面顶部效果的实现代码
May 24 Javascript
详解ES6中的let命令
Apr 05 Javascript
JS中事件冒泡和事件捕获介绍
Dec 13 Javascript
jQuery表格的维护和删除操作
Feb 03 Javascript
ES6实现的遍历目录函数示例
Apr 07 Javascript
纯js封装的ajax功能函数与用法示例
May 14 Javascript
Vue iview-admin框架二级菜单改为三级菜单的方法
Jul 03 Javascript
Vue修改项目启动端口号方法
Nov 07 Javascript
通过javascript实现扫雷游戏代码实例
Feb 09 Javascript
新闻上下滚动jquery 超简洁(必看篇)
Jan 21 #Javascript
vue2.0父子组件及非父子组件之间的通信方法
Jan 21 #Javascript
微信小程序 devtool隐藏的秘密
Jan 21 #Javascript
JS设置CSS样式的方式汇总
Jan 21 #Javascript
JS 实现 ajax 异步浏览器兼容问题
Jan 21 #Javascript
RequireJS 依赖关系的实例(推荐)
Jan 21 #Javascript
js操作浏览器的参数方法
Jan 21 #Javascript
You might like
《Re:从零开始的异世界生活》剧情体验,手游新作定名
2020/04/09 日漫
php获取mysql字段名称和其它信息的例子
2014/04/14 PHP
学习PHP Cookie处理函数
2016/08/09 PHP
功能强大的php文件上传类
2016/08/29 PHP
Zend Framework框架中实现Ajax的方法示例
2017/06/27 PHP
PHP基于imagick扩展实现合成图片的两种方法【附imagick扩展下载】
2017/11/14 PHP
PHP PDOStatement::bindValue讲解
2019/01/30 PHP
jQuery 动画弹出窗体支持多种展现方式
2010/04/29 Javascript
jQuery对表单的操作代码集合
2011/04/06 Javascript
JS读取XML文件示例代码
2013/11/15 Javascript
JQuery中节点遍历方法实例
2015/05/18 Javascript
js获取iframe中的window对象的实现方法
2016/05/20 Javascript
jQuery学习之DOM节点的插入方法总结
2017/01/22 Javascript
js实现随机点名系统(实例讲解)
2017/10/18 Javascript
redux.js详解及基本使用
2019/05/24 Javascript
JavaScript(js)处理的HTML事件、键盘事件、鼠标事件简单示例
2019/11/19 Javascript
利用vue3+ts实现管理后台(增删改查)
2020/10/30 Javascript
uniapp电商小程序实现订单30分钟倒计时
2020/11/01 Javascript
[03:26]回顾2015国际邀请赛中国区预选赛
2015/06/09 DOTA
Python中基础的socket编程实战攻略
2016/06/01 Python
浅谈django中的认证与登录
2016/10/31 Python
python实现读取并显示图片的两种方法
2017/01/13 Python
python去掉空白行的多种实现代码
2018/03/19 Python
python dataframe向下向上填充,fillna和ffill的方法
2018/11/28 Python
简单了解python中对象的取反运算符
2019/07/01 Python
python爬虫 模拟登录人人网过程解析
2019/07/31 Python
详解Python 中sys.stdin.readline()的用法
2019/09/12 Python
英国高档百货连锁店:John Lewis
2017/11/20 全球购物
行政人事经理职位说明书
2014/03/05 职场文书
三万活动总结
2014/04/28 职场文书
居委会四风问题个人对照检查材料
2014/09/25 职场文书
团员个人年度总结
2015/02/26 职场文书
卫生保健工作总结2015
2015/05/18 职场文书
人力资源部工作计划
2019/05/14 职场文书
python之PySide2安装使用及QT Designer UI设计案例教程
2021/07/26 Python
Apache SeaTunnel实现 非CDC数据抽取
2022/05/20 Servers