- 如果要将一个字符串转换为JSON的对象,那么可以使用eval()函数
- 定义文本属性数据的输出
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Javascript_json</title>
<script type="text/javascript">
var data = "{\"name\":\"Maoshu\",\"age\":22,\"sex\":\"男\", "
+ " \"skill\":[\"java\",\"css\",\"html\",\"JavaScript\"], "
+" \"depts\":[{\"deptno\":11,\"dname\":\"Accounting\",\"loc\":\"中国\"}, "
+" {\"deptno\":22,\"dname\":\"Maneager\",\"loc\":\"上海\"}]} ";
var jsonObj = eval("("+data+")");
alert(jsonObj.name);
</script>
</head>
<body>
</body>
</html>
- 输出结果
z
- 如果确实需要通过全部内容的输出操作,那么可以使用foreach语法
- 示例:使用foreach()输出json
- JavaScript的foreach语法为
for(var 变量 in 对象){
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Javascript_json</title>
<script type="text/javascript">
window.onload = function () {
var data = "{\"name\":\"Maoshu\",\"age\":22,\"sex\":\"男\", "
+ " \"skill\":[\"java\",\"css\",\"html\",\"JavaScript\"], "
+" \"depts\":[{\"deptno\":11,\"dname\":\"Accounting\",\"loc\":\"中国\"}, "
+" {\"deptno\":22,\"dname\":\"Maneager\",\"loc\":\"上海\"}]} ";
var jsonObj = eval("("+data+")");
var infoEle = document.getElementById("info");
for(var str in jsonObj){
var pele = document.createElement("p");
pele.appendChild(document.createTextNode("key="+str+",value="+jsonObj[str]));
infoEle.append(pele);
}
};
</script>
</head>
<body>
<div id="info"></div>
</body>
</html>
- 输出的结果为:
- 但是发现基本的数据类型可以直接去的数据内容,而如果是一个数组则会输出为Object.
- 使用以下的语句来查看变量为那种数据类型
typeof 对象
for(var str in jsonObj){
var pele = document.createElement("p");
infoEle.innerHTML += "<p>"+typeof jsonObj[str]+"</p>";
}
- 输出的结果
- 修改代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Javascript_json</title>
<script type="text/javascript">
window.onload = function () {
var data = "{\"name\":\"Maoshu\",\"age\":22,\"sex\":\"男\", "
+ " \"skill\":[\"java\",\"css\",\"html\",\"JavaScript\"], "
+ " \"depts\":[{\"deptno\":11,\"dname\":\"Accounting\",\"loc\":\"中国\"}, "
+ " {\"deptno\":22,\"dname\":\"Maneager\",\"loc\":\"上海\"}]} ";
//解析为json对象
var jsonObj = eval("(" + data + ")");
var infoEle = document.getElementById("info");
//取出json对象中的每一个关键字
for(var key in jsonObj){
//取出每一个value
var value = jsonObj[key];
if(typeof value != "object"){
infoEle.innerHTML += "<p>"+key+":"+value+"</p>";
//判断是否为一个数组
}else if (value.constructor == Array) {
//拼接数组中的内容
var arraystr = "";
for (var x = 0; x < value.length; x++) {
//取出数组中的内容
var arrayValue = value[x];
//判断数组中是否还有对象
if(typeof arrayValue == "object"){
//得到对象中的每一个key
for(var arraykey in arrayValue){
arraystr += arraykey+":"+arrayValue[arraykey]+",";
}
}else {
arraystr += value[x] + ",";
}
}
infoEle.innerHTML += "<p>"+key+":"+arraystr+"</p>";
}
}
}
</script>
</head>
<body>
<div id="info"></div>
</body>
</html>
- 运行结果