Servlet返回数据在JS中的两种解析方式:JSON与XML
本文介绍了Servlet返回数据给前端JavaScript的两种主要解析方式。第一种是通过拼接字符串生成JSON格式,并利用eval函数进行解析;第二种是通过XML格式传输数据,JS端使用responseXML接收。文章对比了两种方式,推荐使用JSON方式,因其更为便捷且无需额外依赖库即可处理复杂对象数据。
Servlet返回数据JS解析概述
本文主要介绍Servlet返回数据在JavaScript中解析的两种方法,通过示例代码详细展示了具体实现过程,对学习和工作具有参考价值。
方法一:使用JSON格式
方法一:使用JSON格式
接收函数:ajax.responseText(注意无括号)
在之前的Ajax使用中,有一个遗留问题:Servlet返回给JavaScript的数据是如何被解析的?
之前示例中仅发送了一句话,因此以HTML格式解析即可成功。但在实际开发中,数据往往存在于对象或对象数组中,我们需要知道如何发送这些数据。
JSON:JavaScript中存在一种数据结构称为JSON,其本质是键值对结构。
例如以下示例:
{ "firstName":"John" , "lastName":"Doe" }
我们可以在Servlet中将属性与值拼接,生成JSON格式的字符串,这样JavaScript就能以该格式解析数据。
具体实现如下:
resp.getWriter().write("{name:"+u.getHeroName()+
",lifenum:"+u.getLifeNum()+
",type:"+u.getType()+
",desc:"+u.getDesc()
+"}")
然而,对于追求效率的开发者来说,手动拼接字符串的方式并不友好,因此需要借助强大的Jar包。
有一款名为gson的Jar包可以协助完成拼接工作。
使用时,只需将对象传入即可,它会自动转换为JSON格式。
接着又产生一个问题:JSON数据给JavaScript有什么用?我们通常操作的是对象!
不必担心,eval函数可以解决这一问题。

方法二:使用XML格式解析
方法二:使用XML格式解析
接收函数:ajax.responseXML(注意无括号)
可以将用户数据以XML格式发送,然后JavaScript也以XML格式进行解析。
用户数据的XML可以写在JSP文件中,然后JavaScript的跳转(open函数)无需跳转到Servlet,而是直接在JSP中查找用户数据。
用户数据JSP示例:
<%@ page language="java" contentType="text/xml; charset=utf-8"%>
<user>
<name>李四</name>
<pwd>123</pwd>
</user>
Ajax接收数据JSP示例:
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
function getXML(){
//创建ajax引擎对象
var ajax;
if(window.XMLHttpRequest){//火狐
ajax=new XMLHttpRequest();
}else if(window.ActiveXObject){//ie
ajax=new ActiveXObject("Msxml2.XMLHTTP");
}
//复写onreadystatechange
ajax.onreadystatechange=function(){
//判断Ajax状态吗
if(ajax.readyState==4){
//判断响应状态吗
if(ajax.status==200){
//获取响应内容
var doc=ajax.responseXML;
//处理响应内容
//获取元素对象
alert(doc.getElementsByTagName("name")[0].innerHTML);
}
}
}
//发送请求
ajax.open("get","xml.jsp",true);
ajax.send(null);
}
</script>
</head>
<body>
<h3>XML数据格式学习</h3>
<hr>
<input type="button" value="测试XML" onclick="getXML()" />
</body>
</html>
然而,这种方式不如JSON方式便捷,因此推荐使用JSON方式进行解析。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持本站。
D3.js 比例尺与坐标轴的配置详解
2026-11-05 16:54:46
JavaScript怎么遍历对象的Symbol键和不可枚举属性
2026-11-05 13:13:39
封装一个健壮的JS字符串判空工具函数
2026-11-05 12:16:14
JavaScript合并数组的三种常用方法:concat、扩展运算符与push
2026-11-05 11:22:29
JavaScript立即执行函数(IIFE)是什么及基本语法
2026-11-05 10:51:19
