写在前面：
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. struts2的<constant/>标签使用

    <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE struts PUBLIC "-/ ...

  2. Masterha-manager避免自动关闭的方法

    Masterha-manager启动默认是前端启动 在用MHA配置了MySQL高可用集群时,当master挂掉,完成高可用切换后,Masterha-manager会自动关闭,这不是我想要的...... ...

  3. 一、MP3文件概述

    一.概述 MP3 文件是由帧(frame)构成的,帧是 MP3 文件最小的组成单位.MP3 的全称应为 MPEG1 Layer-3 音频文件,MPEG(Moving Picture Experts G ...

  4. git使用经验

    一直想写一点关于git的文章,但是平时太懒了,没有写,现在写些经验这里,方便以后自己忘记了.

  5. Windows7中安装内存与可用内存不一致的解决办法

    转载:http://blog.sina.com.cn/s/blog_56741a420100h9d1.html 问题现象: 安装完Windows7后,在计算机->属性中,会看到安装内存.但有时在 ...

  6. Appium项目搭建 For windows

    1.appium又安装了最新版本,更新了,1.4.16.1,然后整理电脑的时候发现自动更新的时候不是在原来的地方进行覆盖,所以就重新安装了一遍,注意需要看下环境变量是否配置了(用户变量:C:\Appi ...

  7. Android通过PHP连接MySQL(用到Json)

    1下载phpnow 如果已经有mysql 则需要换一个端口 在服务器机器上的phpnow安装目录E:\PHPnow-1.5.5\htdocs下新建一个test.php文件: 其中我用的数据库是test ...

  8. 【.NetRemoting-2】2015.09.17

    [Remoting架构] [1]是.NetFramework的一个重要组成 [2]框架的两个重要特性 [A]基本实现[B]可扩展/可定制 [各个组成部分] [1][客户端,客户端应用程序域] [组成] ...

  9. 从汇编看c++对静态成员的存取

    c++中静态成员变量不存在于对象之中,而存在于全局数据段,只是其可见性受到限制,仅能被所属类访问,而非静态成员变量存在于对象中,因而,在访问两种不同数据成员时,会有些许差别.对于静态数据成员的访问,是 ...

  10. asp.net实现伪静态遇到的问题

    之前在一次项目(asp.net网站)中要用到伪静态技术,实现的思路大致是这样的: 在全局配置文件Global.asax(普通的类可以通过实现IHttpModule来完成)中的Application_B ...