<!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"

}

]

jq:get获取json数据并以表格形式生成到页面的更多相关文章

  1. Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据

    jquery.tmpl.js 是一个模板js  ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...

  2. Netflix Falcor获取JSON数据

    Netflix开源了JavaScript库Falcor,它为从多个来源获取JSON数据提供了模型和异步机制. Netflix利用Falcor库实现通过JSON数据填充他们网页应用的用户界面.所有来自内 ...

  3. jquery通过ajax方法获取json数据不执行success

    1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准 ...

  4. jquery用ajax方式从后台获取json数据,将内容填充到下拉列表。

    从后台获取json数据,将内容填充到下拉列表. url:链接 par:ID sel:下拉列表选择器 //获取下拉列表 function BuildSelectBox(url, par, sel) { ...

  5. JQuery 获取json数据$.getJSON方法的实例代码

    这篇文章介绍了JQuery 获取json数据$.getJSON方法的实例代码,有需要的朋友可以参考一下 前台: function SelectProject() { var a = new Array ...

  6. android客户端从服务器端获取json数据并解析的实现代码

    今天总结一下android客户端从服务器端获取json数据的实现代码,需要的朋友可以参考下   首先客户端从服务器端获取json数据 1.利用HttpUrlConnection /** * 从指定的U ...

  7. jquery通过ajax方法获取json数据不执行success回调

    问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准写法,导致总是执行error回调方法 解决方案:使json格式务必符合下述 ...

  8. (转)android客户端从服务器端获取json数据并解析的实现代码

    今天总结一下android客户端从服务器端获取json数据的实现代码,需要的朋友可以参考下       首先客户端从服务器端获取json数据 1.利用HttpUrlConnection   复制代码 ...

  9. android客户端从服务器端获取json数据并解析的实现代码(重要)

    首先客户端从服务器端获取json数据 1.利用HttpUrlConnection /** * 从指定的URL中获取数组 * @param urlPath * @return * @throws Exc ...

随机推荐

  1. MySQL 插入数据时,中文乱码???问题的解决

    在终端,mysql -u root -p 登录: show variables like 'character%'; 来查看当前数据库的相关编码集. client 为客户端使用的字符集. connec ...

  2. Azure构建PredictionIO和Spark的推荐引擎服务

    Azure构建PredictionIO和Spark的推荐引擎服务 1. 在Azure构建Ubuntu 16.04虚拟机 假设前提条件您已有 Azure 帐号,登陆 Azure https://port ...

  3. nginx 参数记录

    log_format custom '$remote_addr - $remote_user [$time_local] ' '"$request" $status $reques ...

  4. UIApplication-备用

    iPhone应用程序是由主函数main启动,它负责调用UIApplicationMain函数,该函数的形式如下所示: int UIApplicationMain ( int argc, char *a ...

  5. VS2013编译libcurl

    首先从这里下载libcurl的package: http://curl.haxx.se/libcurl/ 然后解压,里面有个winbuild文件夹,这里是为windows构建工程的文件夹.里面有nma ...

  6. alias, bg, bind, break, builtin, caller, cd, command,

    bash,  :,  .,  [, alias, bg, bind, break, builtin, caller, cd, command,       compgen, complete, com ...

  7. MongoVUE简单操作手册

    本文转自网络,对疑问的地方做了修改 官方参考文献:http://www.mongovue.com/tutorials/ MongoVUE 是个比较好用的MongoDB客户端,需要注册,但是可以变成永久 ...

  8. HDU_2033——时间加法

    Problem Description HDOJ上面已经有10来道A+B的题目了,相信这些题目曾经是大家的最爱,希望今天的这个A+B能给大家带来好运,也希望这个题目能唤起大家对ACM曾经的热爱.这个题 ...

  9. .Net词汇表中常见缩略语汇总

    .Net中存在大量的专业词汇(详细列表,请参考:Visual Studio 和 .NET Framework 词汇表),其中很多词汇常常采用缩略语的形式被大量使用. 在阅读.Net书籍或网络资料时,便 ...

  10. [深入React] 9.小技巧

    如果组件没有state那就可以精简成一个render function var Item = function(props){ return _('div',null,'名称:'+props.name ...