jQuery中用each方法遍历json对象

json字符串与对象的相互转换

如果声明的是一个字符串，不能直接遍历，需要先将其转换为对象才能遍历

1. eval()

var obj='{"name":"bill","age":"18","home":"河北"}'
console.log("转化前：" + typeof(obj))	//string 
var obj=eval('(' + obj + ')');			//object
console.log("转化后：" + typeof(obj));

2. JSON.parse()

var obj='{"name":"bill","age":"18","home":"河北"}'
var obj=JSON.parse(obj);

3.$.parseJSON(obj)

var obj='{"name":"bill","age":"18","home":"河北"}'
var obj=$.parseJSON(obj);

4. JSON.stringify将对象转换成字符串

var json={
	"name":"bill",
	"age":28
}
var str = JSON.stringify(json);
console.log(typeof(str))	//string

读取内部json数据并渲染到表格

. $.each(obj,function( index,value){})

• 第一个参数是当前要遍历的对象
• 第二个参数是当前遍历元素的索引
• 第三个参数是当前遍历的DOM元素

//声明一个对象
var obj = {
	"标题": "搜狐视频",
	"网址": "https://tv.sohu.com/",
	"类别":{
		"综艺":"小品、相声、真人秀",
		"电影":"动作、爱情、喜剧、恐怖",
		"时事":"国内、国际、时事、政治"
},
	"访问人数":"300000000"
};

代码如下：

var $tab=$("<table border='1' cellpadding='0' cellspacing='0' align='center' width='600'></table>");
				$("body").append($tab)
				$.each(obj,function(key,value){
					var $tr=$("<tr align='center'>" + "<td>" + key + "</td>" + "</tr>");
					if(key=="类别"){
						var $td=$("<td></td>")
						var $tdtab = $("<table border='1' cellpadding='0' cellspacing='0' width='100%'></table>");
						$.each(obj["类别"],function(k,v){
							var $tr2 = $("<tr align='center'>" + "<td>" + k + "</td>" + "<td>" + v + "</td>" +  "</tr>");
							$tdtab.append($tr2)
						})
						$td.append($tdtab)
					}else{
						var $td=$("<td>" + value + "</td>");
					}
					$tr.append($td)
					$tab.append($tr);
				})
			})

读取外部数json数据

$.getJSON("test.json",function(data){
		.......
})

• 第一个参数表示json数据的路径
• 第二个参数表示请求成功之后要执行的函数