Jquery解析Json对象方法总结大全
把json字符串变为json对象的方法总结：
众所周知，在Js/Jquery中是可以使用json对象的，我们要想使用json对象，前提是要把接收到的json字符串转为json对象哦。
下面站长就为大家总结了Jquery解析json的常用方法，希望对大家有帮助
本章方法讲解：不明白的地方，加群@群主即可
1，Jquery发送Post/Get请求，直接解析Json数据（json对象）
2，用eval解析json字符串对象
<!DOCTYPE html>
<html>
<head>
<title>Jquery解析Json对象-yunjson.com</title>
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js" type="text/javascript"></script>
<script> /*
把json字符串变为json对象的方法总结：
众所周知，在Js/Jquery中是可以使用json对象的，我们要想使用json对象，
前提是要把接收到的json字符串转为json对象哦。
下面站长就为大家总结了Jquery解析json的常用方法，希望对大家有帮助
本章方法讲解：不明白的地方，加群@群主即可
1，Jquery发送Post/Get请求，直接解析Json数据（json对象）
2，用eval解析json字符串对象
3，用JSON.parse 解析json对象
*/</script>
</head>
<body>
<script type="text/javascript">
//以下结果，请在console控制台中查看（F12或者审查元素，即可进入Console控制台）
//第一种用法：Jquery接收Post/Get返回值，解析Json数据
//（$.post，$.get，$.getJSON，$.ajax等等 解析json的原理都一样）
$.post('你的URL', { action: 'GetList' }, function (data) {
//此post请求为异步，上面是模拟的测试地址，正式使用时，请换成自己的接口地址
//为了方便，在这里我就直接模拟出json对象数据，直接赋值咯（小盆友不要学我懒省事，哈哈）
data = { "Name": "Json在线解析", "ProUrl": "www.yunjson.com", "SiteID": 1472222, "SiteLink": "官方QQ群：308250404", "SiteInfo": "Json在线工具（http://www.yunjson.com），Json学习资料专题模块，只为你提供最好的Json学习资料，感谢你的支持" };
if (data) {
//接收数据成功，开始处理json对象（此时data就是接收到的json对象）
//现在我们可以得到json数据中，我们需要的某些字段值了
//为了方便查看，直接在控制台中打印出来咯
console.log(data.Name);
console.log(data.ProUrl);
console.log(data.SiteID);
console.log(data.SiteLink);
console.log(data.SiteInfo);
}
}, 'json');
//PS：以上请求中解析json的操作原理，可以简化的表示为以下方法
//定义一个json对象，然后，直接取值（对象.方法名）
var data = { "Name": "Json在线解析", "ProUrl": "www.yunjson.com", "SiteID": 1472222, "SiteLink": "官方QQ群：308250404", "SiteInfo": "Json在线工具（http://www.yunjson.com），Json学习资料专题模块，只为你提供最好的Json学习资料，感谢你的支持" };
console.log(data);
console.log("第一种用法：Jquery用Post/Get调用Json数据");
console.log("Name:--" + data.Name);
console.log("ProUrl:--" + data.ProUrl);
console.log("SiteID:--" + data.SiteID);
console.log("SiteLink:--" + data.SiteLink);
console.log("SiteInfo:--" + data.SiteInfo);
console.log("\r\n-------------------------我是第一和二的方法分割线哦-----------------------------------------------------\r\n");
// ------------------------------我是第一和二的方法分割线哦----------------------------------------------------------
//第二种用法：用eval解析json对象（需要引用jquery插件）
var yunjsontr = '{ "Name": "Json在线解析", "ProUrl": "www.yunjson.com", "SiteID": 1472222, "SiteLink": "官方QQ群：308250404", "SiteInfo": "Json在线工具（http://www.yunjson.com），Json学习资料专题模块，只为你提供最好的Json学习资料，感谢你的支持" }';
evalfun(yunjsontr)
function evalfun(yunjsontr) {
var jsoninfo = eval('(' + yunjsontr + ')'); //此时为json对象，下面可直接调用
console.log(jsoninfo);
console.log("第二种用法：用eval解析json对象,结果值如下");
console.log("Name:--" + jsoninfo.Name);
console.log("ProUrl:--" + jsoninfo.ProUrl);
console.log("SiteID:--" + jsoninfo.SiteID);
console.log("SiteLink:--" + jsoninfo.SiteLink);
console.log("SiteInfo:--" + jsoninfo.SiteInfo);
}
console.log("\r\n-------------------------我是第二和三的方法分割线哦-----------------------------------------------------\r\n");
// ------------------------------我是第二和三的方法分割线哦----------------------------------------------------------
//第三种用法：使用JSON.parse 解析json对象（需要引用jquery插件）
var yunjsontr = '{ "Name": "Json在线解析", "ProUrl": "www.yunjson.com", "SiteID": 1472222, "SiteLink": "官方QQ群：308250404", "SiteInfo": "Json在线工具（http://www.yunjson.com），Json学习资料专题模块，只为你提供最好的Json学习资料，感谢你的支持" }';
jsonparse(yunjsontr);
function jsonparse(yunjsontr) {
var jsonrest = JSON.parse(yunjsontr); //此时为json对象，下面可直接调用
console.log(jsonrest);
console.log("第三种方法：使用JSON.parse 解析json对象");
console.log("Name:--" + jsonrest.Name);
console.log("ProUrl:--" + jsonrest.ProUrl);
console.log("SiteID:--" + jsonrest.SiteID);
console.log("SiteLink:--" + jsonrest.SiteLink);
console.log("SiteInfo:--" + jsonrest.SiteInfo);
}
</script>
</body>
</html>