遍历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 相关文章推荐
常用的javascript function代码
May 23 Javascript
Javascript 表单之间的数据传递代码
Dec 04 Javascript
js png图片(有含有透明)在IE6中为什么不透明了
Feb 07 Javascript
深入分析js中的constructor和prototype
Apr 07 Javascript
js 调用本地exe的例子(支持IE内核的浏览器)
Dec 26 Javascript
判断复选框是否被选中的两种方法
Jun 04 Javascript
jQuery+jsp实现省市县三级联动效果(附源码)
Dec 03 Javascript
关于axios返回空对象的问题解决
Apr 04 Javascript
AngularJS全局警告框实现方法示例
May 18 Javascript
vuex实现登录状态的存储,未登录状态不允许浏览的方法
Mar 09 Javascript
移动端如何用下拉刷新的方式实现上拉加载
Dec 10 Javascript
Jquery的autocomplete插件用法及参数讲解
Mar 12 jQuery
新闻上下滚动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
PHP4引用文件语句的对比
2006/10/09 PHP
PHP中实现汉字转区位码应用源码实例解析
2010/06/14 PHP
PHP操作MongoDB时的整数问题及对策说明
2011/05/02 PHP
php后门URL的防范
2013/11/12 PHP
php使用类继承解决代码重复的问题
2015/02/11 PHP
php实现将HTML页面转换成word并且保存的方法
2016/10/14 PHP
thinkPHP自动验证机制详解
2016/12/05 PHP
基于laravel belongsTo使用详解
2019/10/18 PHP
$.get获取一个文件的内容示例代码
2013/09/11 Javascript
基于jQuery实现Div窗口震动特效代码-代码简单
2015/08/28 Javascript
vue.js开发环境安装教程
2017/03/17 Javascript
javascript流程控制语句集合
2017/09/18 Javascript
浅谈ES6 模板字符串的具体使用方法
2017/11/07 Javascript
vue ssr 实现方式(学习笔记)
2019/01/18 Javascript
使用VueRouter的addRoutes方法实现动态添加用户的权限路由
2019/06/03 Javascript
基于Vue 撸一个指令实现拖拽功能
2019/10/09 Javascript
vue router 传参获取不到的解决方式
2019/11/13 Javascript
vuex 多模块时 模块内部的mutation和action的调用方式
2020/07/24 Javascript
零基础学Python(一)Python环境安装
2014/08/20 Python
Python使用scrapy采集数据时为每个请求随机分配user-agent的方法
2015/04/08 Python
Python json模块使用实例
2015/04/11 Python
全面了解python中的类,对象,方法,属性
2016/09/11 Python
Python实现的KMeans聚类算法实例分析
2018/12/29 Python
python 多线程串行和并行的实例
2019/02/22 Python
selenium获取当前页面的url、源码、title的方法
2019/06/12 Python
详解css3 Transition属性(平滑过渡菜单栏案例)
2017/09/05 HTML / CSS
全球最大的游戏市场:G2A
2018/07/05 全球购物
C++:memset ,memcpy和strcpy的根本区别
2013/04/27 面试题
大学校园活动策划书
2014/02/04 职场文书
教师党性分析材料
2014/02/04 职场文书
优秀三好学生事迹材料
2014/08/31 职场文书
安全温馨提示语大全
2015/07/14 职场文书
记者节感言
2015/08/03 职场文书
2016幼儿教师自荐信范文
2016/01/28 职场文书
2019中小学生安全过暑期倡议书
2019/06/24 职场文书
Nginx配置Https安全认证的实现
2021/05/26 Servers