zoukankan      html  css  js  c++  java
  • Html批量读取json

    html

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
            <title></title>
        </head>
        <body>
            <script type="text/javascript">
                $.ajax({   
                   type: "get",   
                   url:  "DB.json", 
                   datatype: "json",//"xml", "html", "script", "html", "jsonp", "text".
                   success: function (data,status) {
                          document.writeln("学生:<br/>")
                           for (var x in data.student) {
                               document.writeln(data.student[x].name+data.student[x].age+"<br/>")
                           }
                           
                           document.writeln("<p/>老师:<br/>")
                           for (var x in data.teacher) {
                               document.writeln(data.teacher[x].name+data.teacher[x].age+"<br/>")
                           }
                   },
                   error:   function (data,status) { alert("Ajax请求Json错误");}   
                 });  
            </script>
        </body>
    </html>

    json

    { "student": [
    { "name": "小王",  "age": "10" },
    { "name": "小丁",  "age": "20" }
    ],
    "teacher": [
    { "name": "王老师",  "age": "30" },
    { "name": "丁老师",  "age": "40" }
    ] }

    效果

  • 相关阅读:
    事后诸葛亮
    OVS常用命令
    阿里云部署杂记
    Alpha冲刺总结
    测试随笔
    Alpha冲刺集合
    项目Alpha冲刺Day12
    项目Alpha冲刺Day11
    项目Alpha冲刺Day10
    MySQL修改密码
  • 原文地址:https://www.cnblogs.com/dshvv/p/5380751.html
Copyright © 2011-2022 走看看