首页 > 其他分享 >json在前端的使用

json在前端的使用

时间:2023-05-11 19:58:50浏览次数:62  
标签:age json 使用 var 格式 数据 前端

调用接口后一般传递的都是json格式的数据,这个json格式的数据吗可能会有多层嵌套,如何获取这个最内层的嵌套value值便是关键。

而数据解析放在前端便更加的简单,可以像数组一样使用但是需要解决以下问题:

1.数据在后端的时候已经是json格式的object,如何异步发送这个json数据到前端(最新版)或者json格式的数据是一个字符串,如何把这个字符串传递到前端----------通过学习springMVC框架会有解决办法

2.前端如何接收这个json数据-------ajax技术好像可以实现,也要研究一下最新版的技术

3.前段解析数据,并将我想要的部分数据放到指定的id关联的地方去(js实现)

根据这三个问题在最后四周冲刺之内解决。

<script>
//   var brr=[{name:'王建民', age:'100'},{name:'张三',age: '60'}]
//
// for(var i=0;i<brr.length;i++){
//    for(var j in brr[i]){
//        alert(brr[i][j])
//    }
// }

var str={
    "result": {
        "name":'张三',
        "age":"18",
        "edu":[{"college":"清华"},
            {"college":"北大"}],
        "job":[{"time":"2021/05/06"},
            {"place":"北京"},
            {"salary":"30000"}]
    },



    "salary": "7200",
    "skills":[{"技术":"web"},{}],
    "pos":[{},{}]
}
// var mes = JSON.stringify(str);
// document.write(typeof str)   //object
//document.write(typeof mes)   //string
document.write(str.result.name+"<br/>")
document.write(str.result.age+"<br/>")



for(var i=0;i<str.result.edu.length;i++){
   for(var j in str.result.edu[i]){
       document.write(str.result.edu[i][j]+"<br/>" )
   }
}
for(var i=0;i<str.result.job.length;i++) {
    for (var j in str.result.job[i]) {
        document.write(str.result.job[i][j] + "<br/>")
    }
}
    for(var i=0;i<str.skills.length;i++){

        for(var j in str.skills[i]){
            // if(str.skills[i]==null)
            document.write( str.skills[i][j])
        }
}
</script>
 

 

标签:age,json,使用,var,格式,数据,前端
From: https://www.cnblogs.com/copyjames/p/17392040.html

相关文章

  • 05 ffmpeg语法使用参考(个人版)
    【一】合并语法和步骤参考下面是在Python中使用ffmpeg命令将文件夹中的所有.ts文件合并为一个.mp4文件的步骤和代码示例:(1)安装FFmpeg库使用Python之前,您需要安装FFmpeg库。您可以使用如下命令在命令行中安装它:pipinstallffmpeg-python(2)导入FFmpeg库在Python脚本中,您需要......
  • Flink MySQL CDC connector 使用注意事项
    注意事项表要有主键库名和表名不能有点号是个BUG,估计后续会修复。表名不能有大写也是个BUG,估计后续会修复。如果表名含有大写的字母,查询时日志可看到如下信息:java.util.concurrent.ExecutionException:java.io.FileNotFoundException:Filedoesnotexist:hdf......
  • 几个echarts使用小案例
    1y轴名称放左边、辅助线、时间轴标签、数值轴间隔<divid="main"style="height:400px"></div><script>varchartDom=document.getElementById("main");varmyChart=echarts.init(chartDom);varoption;option={xAxis......
  • 使用泛型实现工具类功能
    使用泛型实现公用代码调用,只要是满足条件的入参,出参都是可以实现调用的。代码如下所示:@DatapublicclassCommonParams{privateLongid;privateStringname;}@DatapublicclassBaseDto{privateLongid;}publicclassFanXing{public......
  • 在使用abaqus时可能会遇到的一些问题
    ​我收集了一些网友及客户在使用abaqus软件时遇到的一些问题,下面来看看是如何解决的~ (1)Linux平台使用Abaqus子程序的免费方案gcc+gfortran本方法在centos7和centos8中测试成功安装Linux下yum安装gcc和gfortran配置custom_v6.env文件需要说明的是,gFortran不是官方支持的,以......
  • jumpserver使用
     1页面展示⚓︎页面左侧为功能菜单区,第一次登录默认展示仪表盘界面。右上方区域为功能按钮,可以快速跳转站内信、Web终端、工单、系统设置等功能。可以在图示序号1的位置,进行功能视图的切换。2功能说明⚓︎序号名称说明1控制台管理员操作入口,通过控制台,管理......
  • 使用SVG实现进度条
    主要使用了svg的两个属性:stroke-dasharray:通过数组值创建虚线,可填单个或多个值stroke-dasharray='10'//表示生成长度为10、间隔为10的重复虚线stroke-dasharray='10,5'//表示生成长度为10、间隔为5的重复虚线stroke-dasharray='10,5,15'//表示生成长度为10、......
  • Delphi中使用ADO连接Excel
    第一部分: 1.设置ADOConnection的ConnectionString属性的OLEDB的提供者要选择MicrosoftJet4.0OLEDBProvider(这本来是用于连接Access数据库的驱动程序,但也可打开Excel文件),按"下一步"按钮2.选择数据库名称。注意:Excel的扩展名是*.xls,而默认文件类型是MicrosoftAcce......
  • inputstream转json
    inputstream是一个Java中的输入流,它允许从源读取数据。如果要将inputstream转换为JSON,需要使用相应的解析器,例如GSON或Jackson。以下是使用GSON的示例代码:InputStreaminputStream=...;Gsongson=newGson();JsonReaderreader=newJsonReader(newInputStreamReader(in......
  • 使用laravel-snappy生成pdf
    laravel-snappy基于wkhtmltopdf工具,可以比较完美的将web页面转成pdf格式。顺便把laravel及laravel-snappy安装过程记录下composerconfig-grepo.packagistcomposerhttps://mirrors.aliyun.com/composer/composercreate-projectlaravel/laravelexample-appcomposerr......