<!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. Hibernate数据库对象的创建与导出

    Hibernate 与数据库的关系是ORM关系,对象映射数据库. 那么如何通过对象对数据库进行各种对象的ddl与dml操作呢? 数据库对象操作的〈database-object /〉+ SchemaE ...

  2. scrapy1.1入门用例简介-2

    写一个小的scrapy project,爬取相关网页内容并保存为.json文件 0.创建project,genspider等. 1.修改items.py,内容如下: 2.修改dmoz.py,内容如下: ...

  3. Python自动化运维之3、函数、lambda、递归

    一.函数 函数的基础概念: 函数是python为了代码最大程度地重用和最小化代码冗余而提供的基本结构 函数是一种设计工具,它能让程序员将复杂的系统分解为可管理的部件 函数用于将相关功能打包并参数化 在 ...

  4. iOS开发之UIWebView自动滑动到顶部-备

    但可以通过subview来操作. 通常用UIWebView加载网页,有时候需要点击一个按钮,或者页面的某个部位,使页面自动滚动到顶部,但是UIWebView不像UIScrollView那么方便.   ...

  5. 转:DDR3详解(以Micron MT41J128M8 1Gb DDR3 SDRAM为例)之一

    转载来自:http://blog.csdn.net/shanghaiqianlun/article/details/6976804 作者:shanghaiqianlun的专栏 1.结构框图: 2.管脚 ...

  6. android项目中各个文件的介绍

    src:java源码gen:自动生成 R.javaandroid.jarandroid Dependenvies 支持jar包assets:资产目录 小的数据库 网页 bin:编译生成的临时文件lib ...

  7. bzoj3995[SDOI2015]道路修建

    http://www.lydsy.com/JudgeOnline/problem.php?id=3995 线段树维护连通性. 我们发现,对于一个区间[L,R],我们只需要知道(1,L),(2,L),( ...

  8. mongodb sort limit和skip用法

    > db.mediaCollection.find().skip().toArray() [ { "_id" : ObjectId("5353463193efef0 ...

  9. 【翻译】五步快速使用LINQPad尝鲜StreamInsight

    StreamInsight  学习地址:http://www.cnblogs.com/StreamInsight/archive/2011/10/26/StreamInsight-Query-Seri ...

  10. hdu-1598

    思路: 首先如果想到了Kruskal算法,那么下一步我们可能马上会想:那我们就从头开始写这个算法吧.然后一写就很容易发现一个问题——如果按照正常的Kruskal算法来做,那么start到end的舒适度 ...