面对后端传过来的JSON数据前端开发中如何解析

最新推荐文章于 2023-08-21 20:00:56 发布

原创最新推荐文章于 2023-08-21 20:00:56 发布 · 7.9k 阅读

26 ·

CC 4.0 BY-SA版权

文章标签：

#json #ajax #java #java #json #json jar

本文探讨了在前端开发中如何处理后端通过Ajax传递的JSON数据。通过示例展示了如何获取JSON对象中的特定属性，如msg和data内的name数据。同时也提及了当JSON数据包含数组时的处理方法。

首先解释一下我想要获取的数据，利用Ajax和后端进行异步请求
在这里插入图片描述

然后后端发送过来的数据通过alert()是这样的

在这里插入图片描述
那么问题就是我该如何得到这组数据中的msg中的数据或者data中的name的数据
JSON.parse()方法，这个方法在我们的JS中是一个自带的方法，
调用的时候直接通过JS对象.属性名就可以食用了

在这里插入图片描述
如果传过来的JSON数据中还包含了数组，例如长这样子

{"msg":"成功","code":20000,"records":[
                    {"fw_ctime":"2020-08-01 08:00:00","fw_title":"光明日报聚焦:北斗三号系统全面建成给北斗产业带来什么","fw_description":"澎湃财经",
 "fw_picurl":"https://imagecloud.thepaper.cn/thepaper/image/80/830/440.jpg","fw_url":"https://www.thepaper.cn/newsDetail_forward_8535860"},
                    {"fw_ctime":"2020-08-01 08:00:00","fw_title":"深圳监管沙盒首批应用亮相：华为等申请的智能数字信用卡入围","fw_description":"澎湃财经","fw_picurl":"https://imagecloud.thepaper.cn/thepaper/image/80/729/885.jpg","fw_url":"https://www.thepaper.cn/newsDetail_forward_8527727"},
                    {"fw_ctime":"2020-08-01 08:00:00","fw_title":"美国众议院批准2021年1.3万亿美元支出计划","fw_description":"澎湃财经","fw_picurl":"https://imagecloud.thepaper.cn/thepaper/image/80/824/844.jpg","fw_url":"https://www.thepaper.cn/newsDetail_forward_8535430"}]}

//解析代码如下:
 $.ajax("../ViewUpdateController/showView",{
                type:"get",
                dataType:"text",
                success:function(result){
					var obj=JSON.parse(result);
                    alert(obj.records);
                    $.each(obj.records,function(i,json){
                    	alert(json.fw_title);
                    	//将会获取到每次循环的值
                     })
                }
            })

在这里插入图片描述