zoukankan      html  css  js  c++  java
  • jqery ajax读取json文件

    json文件数据

    [
      {"name":"哈哈··","email":"邮箱01","gender":"男","hobby":["上网","打球"]},
      {"name":"呵呵··","email":"邮箱02","gender":"男","hobby":["网购","打球"]}
    ]

    读取json文件并显示到元素中

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <script src="../lib/jquery/jquery.min.js"></script>
    </head>
    <body>
        <div id="reslut"></div>
    <script>
        $(document).ready(function(){
            $.ajax({
                /*请求方式*/
                type:"GET",
                /*json文件位置*/
                url:"user.js",
                /*返回数据格式为json*/
                dataType:"json",
                /*请求成功完成后要执行的方法*/
                success: function (data) {
                  /*使用$.each方法遍历返回的数据data,*/
                    $.each(data, function (index,obj) {
                        var content = obj.name +","+obj.email+","+obj.gender+","+obj.hobby[0]+","+obj.hobby[1]+"<br/>";
                        /*插入到类名为reslut的元素中*/
                        $("#reslut").append(content);
                    });
                }
            })
        });
    </script>
    </body>
    </html>
  • 相关阅读:
    1039 到底买不买 (20分)
    流密码
    Socket网络编程:互相通讯
    1036 跟奥巴马一起编程
    1033 旧键盘打字
    1029 旧键盘
    1015 德才论 (25分)
    BUU_Real_刷题记录
    vue3 composition api 对比 react hooks
    vue3 文档相关
  • 原文地址:https://www.cnblogs.com/lcf1314/p/5690231.html
Copyright © 2011-2022 走看看