package com.lj.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.lj.lingling.model.Person;
public class ResponseBody extends HttpServlet
{
Map<Integer, List<Person>> persons=new HashMap<Integer, List<Person>>();
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException
{
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException
{
response.setContentType("text/xml;charset=utf-8");
PrintWriter out = response.getWriter();
//获取部门id
int did=Integer.parseInt(request.getParameter("did"));
//获取用户列表对象
List<Person> ps=persons.get(did);
//拼接xml
StringBuffer px=new StringBuffer();
px.append("<persons>");
for(Person p:ps){
px.append("<id>").append(p.getId()).append("</id>");
px.append("<name>").append(p.getName()).append("</name>");
px.append("<age>").append(p.getAge()).append("</age>");
}
px.append("</persons>");
out.write(px.toString());
out.flush();
out.close();
}
public ResponseBody()
{
List<Person> list=new ArrayList<Person>();
list.add(new Person(1,"james",25));
list.add(new Person(2,"smith",22));
persons.put(1, list);
}
}
这里有一个关键的地方就是设置response的ContentType:
response.setContentType("text/xml;charset=utf-8");
这里把返回文本类型设置为text/xml,这样浏览器就会对文本内容进行xml的解析,并显示在浏览器里。
然后是js的代码:
<script type="text/javascript">
window.onload=init;
function init(){
var btn=document.getElementById("getData");
btn.onclick=getData;
}
function getData(){
var xhr=new XMLHttpRequest();
console.log(xhr);
xhr.open("POST", "<%=path%>/servlet/ResponseBody?did=1", true);
xhr.send();
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
//console.log(xhr.responseText);
console.log(xhr.responseXML);
//获取person节点
var pns=xmlDoc.getElementsByTagName("persons");
// console.log(pns.length);
//遍历所有节点, 获取id,name, age
for(var i=0;i<pns.length;i++){
console.log((pns[i].getElementsByTagName("id"))[1].firstChild.nodeValue);
}
}
};
}
</script>
</head>
<body>
<input type="button" value="获取数据" id="getData"/>
<div id="serverData"></div>
</body>
</html>
========================================================================
接下来是json数据类型
首先在servlet里面通过PrintWriter写入数据。
response.setContentType("application/json;charset=utf-8");
PrintWriter out = response.getWriter();
//获取部门id
int did=Integer.parseInt(request.getParameter("did"));
//获取用户列表对象
List<Person> ps=persons.get(did);
//拼接xml
StringBuffer px=new StringBuffer();
px.append("[");
for(Person p:ps){
px.append("{");
px.append("id:").append(p.getId()).append(",");
px.append("name:\"").append(p.getName()).append("\",");
px.append("age:").append(p.getAge()).append("},");
}
px.deleteCharAt(px.lastIndexOf(","));
px.append("]");
out.write(px.toString());
out.flush();
out.close();
页面里的js代码如下:
function getData(){
var xhr=new XMLHttpRequest();
console.log(xhr);
xhr.open("get", "<%=path%>/servlet/ResponseJson?did=1", true);
xhr.send();
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
//console.log(xhr.responseText);
console.log(xhr.responseText);
var ps=eval(xhr.responseText);
console.log(ps.length);
var node="";
for(var i=0;i<ps.length;i++){
node+=ps[i].id+"-------"+ps[i].name+"======<br>";
}
document.getElementById("persons").innerHTML=node;
}
};
}
这里调用了eval(xhr.responseText), 该函数的作用是讲获取的数据转换成json数据类型。
然后通过for循环来获取所有对象内容。
分享到:
相关推荐
XML to JSON and JSON to XML converter
支持键盘和滚轮翻页的javascript读取Json数据分页显示
JSON (JavaScript Object Notation)一种简单的数据格式,比xml更轻巧。 JSON 是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON 数据不需要任何特殊的 API 或工具包。
Javascript读取XML Javascript读取XMLJavascript读取XMLJavascript读取XMLJavascript读取XMLJavascript读取XMLJavascript读取XMLJavascript读取XMLJavascript读取XMLJavascript读取XMLJavascript读取XMLJavascript...
xml 与 json 格式的相互转换,采用javascript 实现。
不推荐下载,该版本存在较多问题 推荐下载笔者的新发布的该版本,名称为xmlhttp_asp+javascript+json+xml
JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。 它基于 ECMAScript (w3c制定的js规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。 简洁和清晰的层次结构使得 ...
editor提取的xml转成特定格式的json
ETL KETTLE 中利用Httpclient 调用webservice接口获取XML数据,并解析XML 数据。 完整的KTR实例
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于JavaScript(Standard ECMA-262 3rd Edition - December 1999)的一个子集。 JSON采用完全独立...
有时数据还是多个动态列表,数据很复杂时,JavaScript程序员喜欢把他们作为json串进行处理,后台收到后需要对json字符串进行解析,幸好有JSON-lib,这个Java类包用于把bean,map和XML转换成JSON并能够把JSON转回成...
NULL 博文链接:https://axl234.iteye.com/blog/1392217
在使用Ajax的时候,通常是将数据以XML的格式返回客户端,然后使用Javascript解析DOM结构。但W3C自带的方法和属性在操作的时候不是很方便。从网上找到一个SoftXMLLib.js,提供了使用XPATH访问节点的方式。对于复杂...
用javascript读取xml文件读取节点数据_.docx
采用规范化的dom来处理上传的xml格式数据, 通过eval方法解译服务端回传的json格式数据。 服务端用asp编写,通过response.binaryRead()解译上传数据, 处理完成后,把数据格式化为jsString,该方法源于继承json2.0.
一个用于将JSON数据转换为Table的JavaScript库
用javascript读取xml文件读取节点数据__1.docx
MSXML与JavaScript语言技术进行XML编程 ,讲述JavaScript生成DOM文档对象的方法
认识JavaScript的数据类型;学习目标;认识JavaScript的数据类型; 1.变量的数据类型;基本数据类型-数字型;认识JavaScript的数据类型;认识JavaScript的数据类型;认识JavaScript的数据类型;认识JavaScript的数据类型;...
就一个页面,里面都是js,巧妙的实现了xml与json直接的互转 很方便