用循环或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 30 Javascript
csdn 论坛技术区平均给分功能
Nov 07 Javascript
JQuery上传插件Uploadify使用详解及错误处理
Apr 27 Javascript
JavaScript中的isXX系列是否继续使用的分析
Apr 16 Javascript
jquery ajax 局部刷新小案例
Feb 08 Javascript
浅谈javascript中的三种弹窗
Oct 21 Javascript
使用angular帮你实现拖拽的示例
Jul 05 Javascript
ionic App问题总结系列之ionic点击系统返回键退出App
Aug 19 Javascript
微信小程序之分享页面如何返回首页的示例
Mar 28 Javascript
浅谈Angular6的服务和依赖注入
Jun 27 Javascript
微信小程序之批量上传并压缩图片的实例代码
Jul 05 Javascript
JavaScript实现的拼图算法分析
Feb 13 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
用PHP实现小写金额转换大写金额的代码(精确到分)
2012/01/10 PHP
fetchAll()与mysql_fetch_array()的区别详解
2013/06/05 PHP
thinkphp实现like模糊查询实例
2014/10/29 PHP
Thinkphp框架+Layui实现图片/文件上传功能分析
2020/02/07 PHP
JavaScript 组件之旅(三):用 Ant 构建组件
2009/10/28 Javascript
利用NodeJS和PhantomJS抓取网站页面信息以及网站截图
2013/11/18 NodeJs
jquery选择器排除某个DOM元素的方法(实例演示)
2014/04/25 Javascript
AngularJS基础知识笔记之表格
2015/05/10 Javascript
jQuery结合ajax实现动态加载文本内容
2015/05/19 Javascript
JS实现不使用图片仿Windows右键菜单效果代码
2015/10/22 Javascript
jquery解析json格式数据的方法(对象、字符串)
2015/11/24 Javascript
详解Bootstrap四种图片样式
2016/01/04 Javascript
jQuery实现点击查看大图并以弹框的形式居中
2016/08/08 Javascript
javascript使用btoa和atob来进行Base64转码和解码
2017/03/20 Javascript
深入理解vue Render函数
2017/07/19 Javascript
Vue侧滑菜单组件——DrawerLayout
2017/12/18 Javascript
atom-design(Vue.js移动端组件库)手势组件使用教程
2019/05/16 Javascript
[01:09:24]Ti4开幕式
2014/07/19 DOTA
Python设计模式之原型模式实例详解
2019/01/18 Python
详解Python3除法之真除法、截断除法和下取整对比
2019/05/23 Python
通过python实现随机交换礼物程序详解
2019/07/10 Python
PyCharm导入python项目并配置虚拟环境的教程详解
2019/10/13 Python
Python3交互式shell ipython3安装及使用详解
2020/07/11 Python
中国领先的汽车保养服务平台:途虎养车
2019/10/18 全球购物
全球领先的中国制造商品在线批发平台:DHgate
2020/01/28 全球购物
《夏夜多美》教学反思
2014/02/17 职场文书
教师节活动主持词
2014/04/02 职场文书
中学生评语大全
2014/04/18 职场文书
英语系本科生求职信
2014/07/15 职场文书
学校做一个有道德的人活动方案
2014/08/23 职场文书
单位实习工作证明怎么写
2014/11/02 职场文书
个人总结格式范文
2015/03/09 职场文书
2015年幼儿园后勤工作总结
2015/04/25 职场文书
考试后的感想
2015/08/07 职场文书
2016拓展训练心得体会范文
2016/01/12 职场文书
七年级生物教学反思
2016/02/20 职场文书