从SERVLET获取一个/多个JSON对象并显示在页面上

配置略，

import java.io.IOException;
import java.io.Writer;
 
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import net.sf.json.JSONObject;  
   
public class GetOneServlet extends HttpServlet {  
    protected void service(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException {
          
        Hero hero = new Hero();
        hero.setName("盖伦");
        hero.setHp(353);
         
        JSONObject json= new JSONObject();
   
        json.put("hero", JSONObject.fromObject(hero));
        response.setContentType("text/html;charset=utf-8");  
        response.getWriter().print(json); //得到流，并写入
    }  
}

前端：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
<title>用AJAX以JSON方式获取数据</title>  
<script type="text/javascript" src="jquery.min.js"></script>  
</head>  
<body>  
    <input type="button" value="通过AJAX获取一个Hero对象" id="sender">   
   
    <div id="messageDiv"></div>  
       
    <script>  
    $('#sender').click(function(){  
        var url="getOneServlet";  
        $.post(
                url, 
                function(data) { 
                     var json=JSON.parse(data);   //获取都数据后，通过JSON.parse 转换为json对象
                     var name =json.hero.name;  
                     var hp = json.hero.hp;
                     $("#messageDiv").html("英雄名称："+name + "<br>英雄血量:" +hp );
                      
         });   
    });  
    </script>  
</body>  
   
</body>
</html>

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
 
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import net.sf.json.JSONSerializer;  
   
public class GetManyServlet extends HttpServlet {  
    protected void service(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException {
        List<Hero> heros = new ArrayList<>();
        for (int i = 0; i < 10; i++) {
            Hero hero = new Hero();
            hero.setName("name"+i);
            hero.setHp(500+i);
            heros.add(hero);
        }
         
        String result =JSONSerializer.toJSON(heros).toString();
 
        response.setContentType("text/html;charset=utf-8");  
        response.getWriter().print(result);
    }  
    public static void main(String[] args) {
        List<Hero> heros = new ArrayList<>();
        for (int i = 0; i < 10; i++) {
            Hero hero = new Hero();
            hero.setName("name"+i);
            hero.setHp(500+i);
            heros.add(hero);
        }
         
        System.out.println(JSONSerializer.toJSON(heros).toString());
    }
}

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
<title>用AJAX以JSON方式获取数据</title>  
<script type="text/javascript" src="jquery.min.js"></script>  
</head>  
<body>  
    <input type="button" value="通过AJAX获取多个Hero对象" id="sender">   
   
    <div id="messageDiv"></div>  
       
    <script>  
    $('#sender').click(function(){  
        var url="getManyServlet";  
        $.post(
                url, 
                function(data) { 
                    var heros = $.parseJSON(data);
                     for(i in heros){
                         var old = $("#messageDiv").html();
                         var hero = heros[i];
                         $("#messageDiv").html(old + "<br>"+hero.name+"   -----   "+hero.hp);  
                     }
         });   
    });  
    </script>  
</body>  
   
</body>
</html>

从SERVLET获取一个/多个JSON对象并显示在页面上

猜你喜欢