首页 > 代码库 > JSON数据;
JSON数据;
1.JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。
2.JSON的规则很简单: 对象是一个无序的“‘名称/值‘对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值‘ 对”之间使用“,”(逗号)分隔。
3.简单的例子:
<body> <div style="border: 1px solid red; width: 100px; height: 100px;" onclick="bian()"></div> </body></html><script type="text/javascript">function bian(){ var user = { //定义一个json数据 "username": "andy", //定义单个字符串 "age": 20, //定义int格式 "info": {"tel": "123456","cellphone": "98765"},//定义一维关联数组类型的 "address": [{"city": "beijing","postcode": "222333"}, {"city": "newyork","postcode": "555666"}]//定义二维数组类型的 } alert(user.username); alert(user.age); alert(user.info.cellphone); alert(user.address[0].city); alert(user.address[0].postcode); user.username = "Tom"; alert(user.username);}</script>
4.json与数组的区别
Json:是在javascript用来存数据的一种方法。Json形式: var Json={a:1 , b:2 , c:3}; var json=[{a:1,b:2,c:3},{d:4,e:5,f:6}];数组形式:var arr=[1,2,3]; var arr=[[a,2,3],[4,5,6]]; Json个数组的区别:1、Json的下标是字符串,如调用第一个数据时用:Json.a 。 数组的下标是数字如 arr[0]2、Json没有length,数组有lengt 用Json来存数据,如果遇到需要循环需要用 for(元素变量 in 变量名){};因为Json没有length所以要用for in循环,for in循环可以用于Json和数组for(i in Json){ 语句}; 什么时候用for循环,什么时候用for in循环?数组:用for循环 for(i=0,i<length,i++){};Json:用for in循环 for(i in Json){};
5.js遍历json数据的几种方法
方式一
var value =http://www.mamicode.com/ { "china":{ "hangzhou":{"code":"1"}, "shanghai":{"code":"2"}, "chengdu":{"code":"3"} }, "America":{ "aa":{"code":"1"}, "bb":{"code":"2"} }, "Spain":{ "dd":{"code":"1"}, "ee":{"code":"2"}, "ff":{"code":"3"} }}; for(var country in value){ document.write(country + ":<br />") for(var city in value[country]) { document.write(‘ ‘ + city + "<br />"); for(var code in value[country][city]) { document.write(" "+ code + value[country][city][code] +"<br />") } } }
country 为value对象的一个属性名,value[country] 为value对象的属性值 这里为一个json对象比如b,value[country][city]为josn对象b的属性值 它也是一个json对象,于是 value[country][city]["code"]便可以取到json对象暂时成为c的值,或者 value[country][city].code。
总之分清是json还是array这是很关键的。
方式二
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 country in value2){ document.write(country + ":<br />") for (var city in value2[country]) { document.write(city + " " + value2[country][city]["name"] + "<br />" ); }}
解释:
country 为value2对象的属性名,value2[country] 为value2对象属性值 在本例中它是一个数组,city是数组的一个元素,它又是另外一个json对象,于是,value2[country][city]["name"]就访问到该对象的 name的属性值,也可以通过 value2[country][city].name 来访问该属性值。
方式三
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 country in value2) { document.write(country + ":<br />") for (var i = 0;i < value2[country].length; i++) { document.write(" " + value2[country][i]["name"] + "<br />"); } }
解释:
country value2对象的属性名,value2[country] 属性值 本例中是一个数组,value2[country].length 数组的长度,value2[country][i]数组的项 == json对象。
value2[country][i]["name"] 取得name的值,也可以用value2[country][i].name 来取得name的值。
6.jquery遍历json数据
grep
<script type=‘text/javascript‘ src="http://www.mamicode.com/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="http://www.mamicode.com/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>
<script type=‘text/javascript‘ src="http://www.mamicode.com/jquery.js"></script><script type="text/javascript">$().ready(function(){var anArray = [‘one‘,‘two‘,‘three‘];var index = $.inArray(‘two‘,anArray);alert(index);//返回该值在数组中的键值,返回1alert(anArray[index]);//value is two});</script>
map
<script type=‘text/javascript‘ src="http://www.mamicode.com/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>
JSON数据;