<!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. OpenStack虚机相关错误

    OpenStack配置起来还是挺麻烦的,特别是网络那块.虽然官方文档越来越清晰,但有时还是会出各种错.排错主要是看日志.看官方文档和google 以下就一些虚机相关常见的错误做一下总结(基于Iceho ...

  2. 导入表 IMPORT_DESCRIPTOR

    typedef struct _IMAGE_IMPORT_DESCRIPTOR { union { DWORD Characteristics; // 0 for terminating null i ...

  3. css3 之表格隔行分色显示

    <html> <head> <title></title> <style type="text/css"> table{ ...

  4. CentOS 6.5 + Nginx 1.8.0 + PHP 5.6(with PHP-FPM) 负载均衡源码安装 之 （四）问题汇总

    关于外网无法访问虚拟机centos的问题 此一般由于centos默认防火墙配置,导致外部不允许访问80端口(或其他如9000端口).解决方法如下: 1.加入80端口的防火墙规则 /sbin/iptab ...

  5. DOCKER内部安装指南

    本文介绍如何在RedHat/CentOS环境下安装Docker.官方文档要求Linux kernel至少3.8以上,且docker只能运行在64位的系统中.由于RHEL6和CentOS6的内核版本为2 ...

  6. 11g v$session定位客户端IP

    11g v$session 新增PORT 字段 用于描述客户端的端口号 客户机从10.5.129.180 访问10.5.128.28 [oracle@cpool ~]$ netstat -na | g ...

  7. 使用定制的ArrayAdapter制作ListView的Items（翻译）

    Translated by:AcerWang    原文出自:customizing-android-listview-items-with-custom-arrayadapter  背景介绍 对于现 ...

  8. hadoop2.2.0 MapReduce的序列化

    package com.my.hadoop.mapreduce.dataformat; import java.io.DataInput;import java.io.DataOutput;impor ...

  9. css中margin:0 auto没作用

    很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题!margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应!其 ...

  10. css入门之css选择器

    CSS选择器 css的选择器最常用的是class选择器,定义方式如下. <!DOCTYPE html> <html lang="en"> <head& ...