转载:jquery 对 Json 的各种遍历
概述
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;
}
注明出处格式:前端开发博客 (http://caibaojian.com/jquery-each-json.html)
转载:jquery 对 Json 的各种遍历的更多相关文章
- [转]jquery 对 Json 的各种遍历
原文地址:http://caibaojian.com/jquery-each-json.html 概述 JSON(javascript Object Notation) 是一种轻量级的数据交换格式,采 ...
- jquery 对 Json 的各种遍历
grep <script type='text/javascript' src="/jquery.js"></script> <script type ...
- jquery ajax json 数据的遍历
需求:进行ajax请求后,后台传递回来以下json数据 { "data":[ {","name":"选择A","valu ...
- Javascript/jQuery关于JSON或数组集合的几种循环方法
JavaScript遍历JSON或数组集合: /** * 根据json数据生成option树形控件 * 如果有children节点则自动生成树形数据 * @param {JSON} data * @p ...
- [转] 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 ...
- <转载> Jquery的性能优化-实用!
我一直在寻找有关jQuery性能优化方面的小窍门,能让我那臃肿的动态网页应用变得轻便些.找了很多文章后,我决定将最好最常用的一些优化性能的建议列出来 ========================= ...
- jquery下json数组的操作用法实例
jquery下json数组的操作用法实例: jquery中操作JSON数组的情况中遍历方法用的比较多,但用添加移除这些好像就不是太多了. 试过json[i].remove(),json.remove( ...
随机推荐
- 基于Homestead搭建PHP项目开发环境(适合Zend Framework,Laravel,Yii,thinkphp等)
参考: https://framework.zend.com/bl...参考: https://laravel.com/docs/5.5/... 第一步:软件的下载和安装 软件1:VirtualBox ...
- Golang - 开篇必须吹牛逼
目录 Golang - 开篇必须吹牛逼 Go牛逼吗 安装环境 Golang - 开篇必须吹牛逼 (1)我们为什么要学 高并发 深度 || 广度 (2)go学习思路和目标 多打多练 掌握go语言 做一个 ...
- numpy中sum(axis=0)和axis=1的计算原理
看起来挺简单的样子,但是在给sum函数中加入参数.sum(a,axis=0)或者是.sum(axis=1) 就有点不解了 在我实验以后发现 我们平时用的sum应该是默认的axis=0 就是普通的相加 ...
- 葵花宝典之机器学习:全网最重要的AI资源都在这里了(大牛,研究机构,视频,博客,书籍,Quora......)
https://blog.csdn.net/wemedia/details.html?id=42039
- js的map文件
什么是source map文件 source map文件是js文件压缩后,文件的变量名替换对应.变量所在位置等元信息数据文件,一般这种文件和min.js主文件放在同一个目录下. 比如压缩后原变量是ma ...
- mongodb-replication set 复制集
推荐一篇mongodb集群的博客 replication set 多台服务器维护相同的数据副本,提高服务的可用性 1.启动3个实例,且声明属于某复制集 mongod --port 27017 --db ...
- 洛谷——P1060 开心的金明
https://www.luogu.org/problem/show?pid=1060#sub 题目描述 金明今天很开心,家里购置的新房就要领钥匙了,新房里有一间他自己专用的很宽敞的房间.更让他高兴的 ...
- HDU 2224 The shortest path
The shortest path Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others ...
- Java-基本输入输出
Scanner sc = new Scanner(System.in); System.out.println("Please input the path:"); String ...
- 使用RabbitMQ放置自己定义对象(不借助序列化工具,比如protobuffer)V2.0
怎样使用RabbitMQ盛放自己定义的对象呢?一般都会使用序列化工具在投放之前转换一次.从MQ取回的时候再逆序列化还原为本地对象.这里使用C++自带的强制类型装换,将本地对象的内存模型当做自然的序列化 ...