写在前面:
1、源代码来源于博客http://blog.sina.com.cn/u/2904067371 ,在此基础上对于前端代码稍作更改,把传过来的数据解析并传入表格
2、json解析,用eval()
3、写入表格 table.rows[i].cells[j].innerHTML
4、导入java中json应用的jar包(如果没有导入jar包或者包不全就不会有import net.sf.json.JSONArray;import net.sf.json.JSONObject;
JSONArray、JSONObject会报错。
)

5、测试字符串如下:{"person":[{"id":3,"name":"ss","pwd":"1234"},{"id":23,"name":"ws","pwd":"124"}]}

json jar包百度云:

http://pan.baidu.com/s/1i3GNJ9N

工程截图:

效果截图:

代码:

Person.java

package com.orilore.gb;

public class Person {
public int getId() {
return id;
} public void setId(int id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getPwd() {
return pwd;
}
public void setPwd(String pwd) {
this.pwd = pwd;
}
private int id;
private String name;
private String pwd; }

servlet  json.java

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { doPost(request, response);
} public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { response.setContentType("text/xml;character=utf-8");
response.setHeader("Cache-Control", "no-cache");
try{
Person p =new Person();
p.setName("ss");
p.setId();
p.setPwd(""); Person p1 =new Person();
p1.setName("ws");
p1.setId();
p1.setPwd("");
List<Person> list =new ArrayList<Person>();
list.add(p);
list.add(p1);
try{ JSONArray json =JSONArray.fromObject(list);
JSONObject jb =new JSONObject();
jb.put("person", json);
response.getWriter().write(jb.toString());
}catch(IOException e){
e.printStackTrace();
}
}catch(Exception e){
e.printStackTrace();
} }

前端页面代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
</head>
<body>
<input type="button" onclick="validate()" value="dsfdsafa" >
<div id="div"></div>
<table border="" style="width:300px;height:200px;" id="table">
<tr id="tr" border=""><td></td>
<td></td>
<td></td></tr> <tr border=""><td></td>
<td></td>
<td></td></tr></table>
<script type="text/javascript"> function validate(){
var div=document.getElementById("div");
var xmlhttp;
var table=document.getElementById('table'); if(window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{
xmlhttp=new ActiveObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState== && xmlhttp.status==){
var x=xmlhttp.responseText
div.innerHTML=x;
var sd=eval("(" + x + ")"); var arr=new Array();
var i=;
for(var a in sd.person){//获取有几个person
var count=;//计算person属性值的个数
i++;
for(var item in sd.person[a])
{ count++;
var p=sd.person[a][item];//得到属性值的内容
table.rows[i-].cells[count-].innerHTML=p;//把内容填向table表格
}
}
}
}
var url ="json";
xmlhttp.open("POST",url,true);
xmlhttp.send(); }
</script>
</body>
</html>

servlet+ajax+json字符串后台传入,前端解析并把数据循环填入表格实例的更多相关文章

  1. JSON字符串——后台解析系列

    以前我们都是讲JSON字符串获取后,在前台进行展示.今天小编就交给大家后台解析展示数据的方法.非常方便,就以下代码: JObject obj = JObject.Parse(data); string ...

  2. 4. JSON字符串是如何被解析的?JsonParser了解一下

    公司不是你家,领导不是你妈.本文已被 https://www.yourbatman.cn 收录,里面一并有Spring技术栈.MyBatis.JVM.中间件等小而美的专栏供以免费学习.关注公众号[BA ...

  3. 使用JavaScriptSerializer序列化集合、字典、数组、DataTable为JSON字符串 分类: 前端 数据格式 JSON 2014-10-30 14:08 169人阅读 评论(0) 收藏

    一.JSON简介 JSON(JavaScript Object Notation,JavaScript对象表示法)是一种轻量级的数据交换格式. JSON是"名值对"的集合.结构由大 ...

  4. AJAX —— JSON 字符串 与 JSON 对象

    一.JSON 字符串转 JSON 对象 ----> JSON.parse(JString); 1 // JSON 字符串转 JSON 对象 ----> JSON.parse(JString ...

  5. json数组和json字符串转换成map解析

    package demo; import java.util.List;import java.util.Map;import java.util.Map.Entry; import net.sf.j ...

  6. ajax json struts JSP传递消息到action返回数据到JSP

    ACTION package actions; import com.opensymphony.xwork2.ActionSupport; import net.sf.json.JSONObject; ...

  7. 使用JQuery将前端form表单数据转换为JSON字符串传递到后台处理

    一般地,我们在处理表单(form表单哦)数据时,传输对象或字符串到后台,Spring MVC或SpringBoot的Controller接收时使用一个对象作为参数就可以被正常接收并封装到对象中.这种方 ...

  8. Web jsp开发自学——ajax+servlet+echarts+json+gson 实现ajax传输servlert和echarts的数据,可视化结果

    感谢下面的博主,我学习的博客有: https://blog.csdn.net/ITBigGod/article/details/81023802  Jsp+Servlet+Echarts实现动态数据可 ...

  9. mysql解析json字符串相关问题

    很多时候,我们需要在sql里面直接解析json字符串.这里针对mysql5.7版本的分水岭进行区分. 1.对于mysql5.7以上版本 使用mysql的内置函数JSON_EXTRACT(column, ...

随机推荐

  1. HDU 1695 GCD 欧拉函数+容斥定理

    输入a b c d k求有多少对x y 使得x在a-b区间 y在c-d区间 gcd(x, y) = k 此外a和c一定是1 由于gcd(x, y) == k 将b和d都除以k 题目转化为1到b/k 和 ...

  2. BCD码、十六进制与十进制互转

    在做嵌入式软件的设计中,常常会遇到十六进制.BCD码与十进制之间的转换,近期做M1卡的应用中,涉及了大量的十六进制.BCD码与十进制之间的转换.通过对BCD码.十六进制 权的理解,轻松的实现了他们之间 ...

  3. 【极客学院出品】Cocos2d-X系列课程之九-BOX2D物理引擎

    Cocos2d-x 是时下最热门的手游引擎,在国内和国外手机游戏开发使用的份额各自是70%和25%,在App Store的top10中,有7个是用它开发的. 本节课程为Cocos2d-x系列课程之九, ...

  4. Linux以及Android开发中的小技巧和长繁命令记录收集

    不断更新收集中.... 201407161654 ssh以nx_guest的身份登录到172.24.221.137,然后在172.24.221.137与172.24.61.252的8080port建立 ...

  5. 给小班讲stl 之 map、sort、优先队列

    引子:最近老师让给小班讲课,讲stl,,但是我觉得就小班现在这水平根本讲不懂好不好,,,,

  6. 【搜索引擎Jediael开发笔记2】使用HttpClient下载网页至本地文件

    本文使用HttpClient根据url进行网页下载.其中 (1)HttpClient的相关知识请参见HttpClient基础教程 (2) package org.ljh.search.download ...

  7. 认识JSONP

    jsonp 全称是JSON with Padding 我们大家都知道ajax是不能发起跨域请求,现在可以通过jsonp来弥补ajax的这一缺陷 通过script标签的src属性就可以实现跨域请求.如( ...

  8. css 兼容小三角

    <!DOCTYPE><html ><head><meta http-equiv="Content-Type" content=" ...

  9. PHP获取生成一个页面的数据库查询次数(转)

    很多博客软件都有这么一个功能,比如“生成本次页面一共花费了xx毫秒,进行了xx次数据库查询”等等.那么这个功能是如何实现的呢,下面我大概说下思路. 1. 在类的构造函数中声明全局变量 定义一个全局变量 ...

  10. *1022. D进制的A+B【考前最后一道题】

      /* *Main.c *1022. D进制的A+B Ver.1 *Created on : 2014.9.5 *****测试通过****** */ #include <stdio.h> ...