zoukankan      html  css  js  c++  java
  • jq:get获取json数据并以表格形式生成到页面

    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="utf-8">

    <title>jq-get方法</title>

    <script type="text/javascript" src="../jquery-2.1.3.min.js"></script>

    <script type="text/javascript">

    $(function(){

                         $("input").click(function(){

                                 $.get("test.json",function(data){

                                         var data=data;

                                         var str="<table  border=1 width=100%>";

                                         str+="<tr>";

                                         for(var n in data[0]){

                                                 str+="<th>"+n+"</th>";

                                         }

                                         str+="</tr>";

                                         for(var i=0;i<data.length;i++){

                                                 str+="<tr>";

                                                 for(var n in data[i]){

                                                         str+="<td align='center'>"+data[i][n]+"</td>";

                                                 }

                                                 str+="</tr>";

                                         }

                                         str+="</table>";

                                         $("div").html(str);

                                 })

                         })

                 })

    </script> 

    </head> 

    <body>

    <input type="button" value="向服务器发出异步请求" />

    <div></div>

    </body> 

    </html>

    test.json文件:

    [

    {

    "name": "艳艳",

    "pass": "123456",

    "age": "26"

    },

    {

    "name": "张三",

    "pass": "88888888",

    "age": "28"

    },

    {

    "name": "李四",

    "pass": "111111",

    "age": "29"

    }

    ]

  • 相关阅读:
    MFC生成的exe程序不能在其他电脑上运行怎么办
    MFC开发软件支持多语言且同时支持xp和win7操作系统
    MFC创建模态对话框与非模态对话框
    如何定位BAD_ACCESS
    iOS中几种数据持久化方案
    iOS NSString相关问题
    SPU
    WIKI
    Mac怎么快速创建便签和发送附件的邮件
    利用你的Mission Control--设置快速回到桌面等操作
  • 原文地址:https://www.cnblogs.com/niwalala/p/5099627.html
Copyright © 2011-2022 走看看