[转]jquery 对 Json 的各种遍历
原文地址:http://caibaojian.com/jquery-each-json.html
概述
JSON(javascript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式。同时,JSON是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不须要任何特殊的 API 或工具包。
在JSON中,有两种结构:对象和数组。
1.对象
一个对象以“{”开始,“}”结束。每个“key”后跟一“:”,“‘key/value’ 对”之间运用 “,”分隔。
packJson = {"name":"caibaojian.com", "password":"111"}
2.数组
packJson = [{"name":"caibaojian.com", "password":"111"}, {"name":"tony", "password":"111"}];
数组是值的有序集合。一个数组以“[”开始,“]”结束。值之间运用 “,”分隔。
JSON对象和JSON字符串的转换
在数据传输流程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键。例如:
JSON字符串:
var jsonStr = '{"name":"caibaojian", "password":"1111"}';
JSON对象:
var jsonObj = {"name":"caibaojian.com", "password":"1111"};
1、String转换为Json对象
var jsonObj = eval('(' + jsonStr + ')');
2.Json对象转换为String字符串
var jsonStr = jsonObj.toJSONString();
jQuery遍历json对象
grep
<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
function(){
var array = [1,2,3,4,5,6,7,8,9];
var filterarray = $.grep(array,function(value){
return value > 5;//筛选出大于5的
});
for(var i=0;i<filterarray.length;i++){
alert(filterarray[i]);
}
for (key in filterarray){
alert(filterarray[key]);
}
}
);
</script>
each
<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
function(){
var anObject = {one:1,two:2,three:3};//对json数组each
$.each(anObject,function(name,value) {
alert(name);
alert(value);
});
var anArray = ['one','two','three'];
$.each(anArray,function(n,value){
alert(n);
alert(value);
}
);
}
);
</script>
inArray
<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
function(){
var anArray = ['one','two','three'];
var index = $.inArray('two',anArray);
alert(index);//返回该值在数组中的键值,返回1
alert(anArray[index]);//value is two
}
);
</script>
map
<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
function(){
var strings = ['0','1','2','3','4','S','6'];
var values = $.map(strings,function(value){
var result = new Number(value);
return isNaN(result) ? null:result;//isNaN:is Not a Number的缩写
}
);
for (key in values) {
alert(values[key]);
}
}
);
</script>
原生js遍历json对象
遍历json对象:
无规律:
<script>
var json = [{dd:'SB',AA:'东东',re1:123},{cccc:'dd',lk:'1qw'}];
for(var i=0,l=json.length;i<l;i++){
for(var key in json[i]){
alert(key+':'+json[i][key]);
}
}
</script>
有规律:
packJson = [
{"name":"nikita", "password":"1111"},
{"name":"tony", "password":"2222"}
];
for(var p in packJson){//遍历json数组时,这么写p为索引,0,1
alert(packJson[p].name + " " + packJson[p].password);
}
也可以用这个:
for(var i = 0; i < packJson.length; i++){
alert(packJson[i].name + " " + packJson[i].password);
}
遍历json对象
myJson = {"name":"caibaojian", "password":"1111"};
for(var p in myJson){//遍历json对象的每个key/value对,p为key
alert(p + " " + myJson[p]);
}
有如下 json对象:
var obj ={"name":"冯娟","password":"123456","department":"技术部","sex":"女","old":30};
遍历方法:
for(var p in obj){
str = str+obj[p]+’,';
return str;
}
[转]jquery 对 Json 的各种遍历的更多相关文章
- 转载:jquery 对 Json 的各种遍历
概述 JSON(javascript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式 ...
- jquery 对 Json 的各种遍历
grep <script type='text/javascript' src="/jquery.js"></script> <script type ...
- jquery ajax json 数据的遍历
需求:进行ajax请求后,后台传递回来以下json数据 { "data":[ {","name":"选择A","valu ...
- [转] jQuery 操作 JSON 数据
jquery下json数组的操作用法实例: jquery中操作JSON数组的情况中遍历方法用的比较多,但用添加移除这些好像就不是太多了. 试过json[i].remove(),json.remove( ...
- php+jquery+ajax+json简单小例子
直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...
- Jquery之JSON的用法
今天讲了Jquery里面JSON的用法,下面是今天讲课给的例子: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" &quo ...
- Javascript/jQuery关于JSON或数组集合的几种循环方法
JavaScript遍历JSON或数组集合: /** * 根据json数据生成option树形控件 * 如果有children节点则自动生成树形数据 * @param {JSON} data * @p ...
- jquery下json数组的操作用法实例
jquery下json数组的操作用法实例: jquery中操作JSON数组的情况中遍历方法用的比较多,但用添加移除这些好像就不是太多了. 试过json[i].remove(),json.remove( ...
- jQuery对json快速赋值
jQuery对json快速赋值,重点在于将input的id取跟JSON同样的名称. <!DOCTYPE html> <html> <head lang="en& ...
随机推荐
- MMORPG大型游戏设计与开发(客户端架构 part14 of vegine)
渲染在客户端中具有着至关重要的地位,试想我们玩游戏的第一感觉是什么就会明白了,良好的画面效果对客户端来说是多么的迫切.没有学习过opengl或是direct3d这些渲染API的朋友们也不必担心,而学习 ...
- unix automake 使用,快速生成你的Makefile
使用automake快速生成编译的Makefile 1,确保自己装有的软件automake autoconf 2, 1)执行autoscan 并将生成的configure.scan重命名为config ...
- 平面直接坐标系线段相交问题(小Q(钟神)的问题)
[问题描述] 小 Q 对计算几何有着浓厚的兴趣.他经常对着平面直角坐标系发呆,思考一些有趣的问题.今天,他想到了一个十分有意思的题目:首先,小 Q 会在?轴正半轴和?轴正半轴分别挑选?个点.随后,他将 ...
- jmeter 监控服务器的内存,cpu等内容
1.需要下载一个jar包,放入到lib /ext文件中 JMeterPlugins-Standard.jar 2.在服务器上安装 perfmon server agent 这里监控内存我们使用的是: ...
- Guava中Predicate的常见用法
Guava中Predicate的常见用法 1. Predicate基本用法 guava提供了许多利用Functions和Predicates来操作Collections的工具,一般在 Iterabl ...
- 嵌入式Linux驱动学习之路(六)u-boot启动内核
内核启动是需要必要的启动参数.不能开机自动完全从0开始启动,需要uboot帮助内核实现重定位并提供参数. 首先,uboo会从Kernel分区中读取bootcmd环境变量,根据环境变量可自动启动. 分区 ...
- 任务调度开源框架Quartz动态添加、修改和删除定时任务
Quartz 是个开源的作业调度框架,为在 Java 应用程序中进行作业调度提供了简单却强大的机制.Quartz框架包含了调度器监听.作业和触发器监听.你可以配置作业和触发器监听为全局监听或者是特定于 ...
- 查看LINUX进程内存占用情况
可以直接使用top命令后,查看%MEM的内容.可以选择按进程查看或者按用户查看,如想查看oracle用户的进程内存使用情况的话可以使用如下的命令: (1)top top命令是Linux下常用的性能分析 ...
- Android中实现如下多语言选择Radiobutton效果
手边的samsung手机设置多语言的方式一般是点击设置多语言的一栏后进入到多语言选择界面,选择完成之后当前的语言环境用小字方式直接显示在设置多语言栏的下方.另一种选择多语言的方式如上图所示,我也在系统 ...
- sublime安装package control组件
第一步,首先到这个网站https://packagecontrol.io/installation去下载Package Control.sublime-package文件 第二步,将下载的文件放到C: ...