用循环或if语句从json中取数据示例


Posted in Javascript onAugust 18, 2014

首先,例如json数据如下书写:

{"head": [ 
{"text":"广州","id":"广州","pid":"广东省"}, 
{"text":"郑州","id":"郑州","pid":"河南省"}], 
}

如上,倘若想将id和pid数据依次取出,就只能用循环,代码如下:

var head_id = ""; 
var head_pid = ""; 
for (var i = 0; i < data.head.length; i++) { 
head_id += data.head[i].id + " "; //循环输出json数据 
head_pid += data.head[i].pid + " "; 
} 
$("#city").append("city:" + head_id); 
$("#city").append("province:" + head_pid);

这样,将会在data之后,依次输出json中的数据。

若想有选择性的输出时,需要添加if条件,代码如下:

for (var i = 0; i < data.head.length; i++) { 
if (data.head[i].pid == "河南省") { //有选择的输出json数据 
head_pid += data.head[i].pid; 
} 
}

需要注意的是,倘若对象中有多组数据,则用data.head.id是undefined的,因为没有标明是哪组数据,例如data.head[0].id,若对象中只有一组数据,则可以直接用data.head.id输出。

另外,倘若调出来的json数据,中文乱码,一方面查看json调用的jquery代码,另一方面,可能是编写json数据的文件的问题。

以上是自学json的一点学习所得,记录一下。

(注:对象中多个数据时,直接使用)(注:对象中多个数据时,直接使用)

Javascript 相关文章推荐
JavaScript编程开发中的五个实用小技巧
Jul 22 Javascript
避免回车键导致的页面无意义刷新的解决方法
Apr 12 Javascript
JavaScript初学者应注意的七个细节小结
Jan 30 Javascript
JavaScript:new 一个函数和直接调用函数的区别分析
Jul 10 Javascript
html dom节点操作(获取/修改/添加或删除)
Jan 23 Javascript
jquery图形密码实现方法
Mar 11 Javascript
JavaScript显示当前文档最后修改日期的方法
Mar 19 Javascript
分离与继承的思想实现图片上传后的预览功能:ImageUploadView
Apr 07 Javascript
微信小程序canvas拖拽、截图组件功能
Sep 04 Javascript
vue-router之nuxt动态路由设置的两种方法小结
Sep 26 Javascript
vue-cli3.0 脚手架搭建项目的过程详解
Oct 19 Javascript
Vue动态组件与异步组件实例详解
Feb 23 Javascript
通过jquery 获取URL参数并进行转码
Aug 18 #Javascript
浅谈JavaScript中定义变量时有无var声明的区别
Aug 18 #Javascript
[将免费进行到底]在Amazon的一年免费服务器上安装Node.JS, NPM和OurJS博客
Aug 18 #Javascript
使用node.js半年来总结的 10 条经验
Aug 18 #Javascript
推荐 21 款优秀的高性能 Node.js 开发框架
Aug 18 #Javascript
根据当前时间在jsp页面上显示上午或下午
Aug 18 #Javascript
JQuery中使用Ajax赋值给全局变量失败异常的解决方法
Aug 18 #Javascript
You might like
《APMServ 5.1.2》使用图解
2006/10/23 PHP
CI框架自动加载session出现报错的解决办法
2014/06/17 PHP
php表单敏感字符过滤类
2014/12/08 PHP
php使用curl实现ftp文件下载功能
2017/05/16 PHP
javascript 学习之旅 (2)
2009/02/05 Javascript
js 操作css实现代码
2009/06/11 Javascript
JSQL 批量图片切换的实现代码
2010/05/05 Javascript
倒记时60刷新网页的js代码
2014/02/18 Javascript
JS实现CheckBox复选框全选全不选功能
2015/05/06 Javascript
Web性能优化系列 10个提升JavaScript性能的技巧
2016/09/27 Javascript
jQuery动态创建元素以及追加节点的实现方法
2016/10/20 Javascript
Vue自定义指令使用方法详解
2017/08/21 Javascript
浅谈Angular4实现热加载开发旅程
2017/09/08 Javascript
vue中element组件样式修改无效的解决方法
2018/02/03 Javascript
p5.js入门教程和基本形状绘制
2018/03/15 Javascript
vue组件详解之使用slot分发内容
2018/04/09 Javascript
详解vue组件开发脚手架
2018/06/15 Javascript
微信小程序实现多选删除列表数据功能示例
2019/01/15 Javascript
Vue 实现拨打电话操作
2020/11/16 Javascript
手把手教你如何编译打包video.js
2020/12/09 Javascript
python实现实时监控文件的方法
2016/08/26 Python
Python设计模式之观察者模式简单示例
2018/01/10 Python
python使用pandas实现数据分割实例代码
2018/01/25 Python
python多进程读图提取特征存npy
2019/05/21 Python
Python csv文件的读写操作实例详解
2019/11/19 Python
python多线程实现代码(模拟银行服务操作流程)
2020/01/13 Python
Python3 ID3决策树判断申请贷款是否成功的实现代码
2020/05/21 Python
Python将QQ聊天记录生成词云的示例代码
2021/02/10 Python
PurCotton全棉时代官网:100%天然棉花生产的生活护理用品
2016/11/18 全球购物
Nike西班牙官方网站:Nike.com (ES)
2017/10/30 全球购物
寒假思想汇报
2014/01/10 职场文书
开业典礼主持词
2014/03/21 职场文书
团队队名口号大全
2014/06/06 职场文书
2014学习优秀共产党员先进事迹思想汇报
2014/09/14 职场文书
2015年小学图书室工作总结
2015/05/18 职场文书
详细了解MVC+proxy
2021/07/09 Java/Android