Servlet返回的数据js解析2种方法


Posted in Javascript onDecember 12, 2019

这篇文章主要介绍了Servlet返回的数据js解析2种方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

方式1:Json

接收函数:ajax.responseText后面没括号

其实在之前所说的ajax中还遗留了一些问题就是,Servlet返回给js的数据是如何被js解析的呢?

之前只是发送了一句话,所以他就以html的格式进行解析就成功了,但是在实际中我们往往发送的数据是存在一个对象当中的又或者是一组对象当中的,我们应该如何发送呢?

json:js当中有一种有一种结构就是json,说白了就是键值对。

例如下面的:

{ "firstName":"John" , "lastName":"Doe" }

我们可以在Servlet将属性与值进行拼接,得到json格式的字符串,这样js中就能以这样的格式进行数据的解析了。

类似于下面这样:

resp.getWriter().write("{name:"+u.getHeroName()+ 
                ",lifenum:"+u.getLifeNum()+
                ",type:"+u.getType()+
                ",desc:"+u.getDesc()
        +"}")

但是对于懒癌来说这样的方式是极不友好的,所以就要说到强大的jar包了。

有一款名为gson的jar包可以帮你完成拼接的工作

对于使用就是你直接将对象丢进去就好,它会自动帮你转为json格式。

然后又有问题来了,json的数据给js有什么用,我们一般操纵的是对象呀!

别慌,eval帮你解决

Servlet返回的数据js解析2种方法

方式2:XML进行解析

接收函数:ajax.responseXML后面没括号

可以将用户数据以Xml进行发送然后js也以xml格式解析

用户数据的xml可以写在jsp中,然后js的跳转(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方式进行进行解析会更好一点。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript入门教程(12) js对象化编程
Jan 31 Javascript
document.compatMode的CSS1compat使用介绍
Apr 03 Javascript
javascript中解析四则运算表达式的算法和示例
Aug 11 Javascript
javascript三元运算符用法实例
Apr 16 Javascript
简单介绍JavaScript数据类型之隐式类型转换
Dec 28 Javascript
JavaScript中文件上传API详解
Apr 01 Javascript
基于javascript bootstrap实现生日日期联动选择
Apr 07 Javascript
Javascript的比较汇总
Jul 25 Javascript
vue单页面实现当前页面刷新或跳转时提示保存
Nov 02 Javascript
在Vue环境下利用worker运行interval计时器的步骤
Aug 01 Javascript
Vue中fragment.js使用方法小结
Feb 17 Javascript
js实现炫酷光感效果
Sep 05 Javascript
微信小程序实现横向滚动导航栏效果
Dec 12 #Javascript
微信小程序 scroll-view 实现锚点跳转功能
Dec 12 #Javascript
微信小程序scroll-view锚点链接滚动跳转功能
Dec 12 #Javascript
JavaScript实现文件下载并重命名代码实例
Dec 12 #Javascript
vue实现鼠标移过出现下拉二级菜单功能
Dec 12 #Javascript
微信小程序背景音乐开发详解
Dec 12 #Javascript
vue实现商城秒杀倒计时功能
Dec 12 #Javascript
You might like
PHP无刷新上传文件实现代码
2011/09/19 PHP
php实现utf-8和GB2312编码相互转换函数代码
2013/02/07 PHP
php cookie用户登录的详解及实例代码
2017/01/03 PHP
jquery实现TAB选项卡鼠标经过带延迟效果的方法
2015/07/27 Javascript
JavaScript学习笔记之DOM基础 2.4
2015/08/14 Javascript
关于cookie的初识和运用(js和jq)
2016/04/07 Javascript
Angularjs中的页面访问权限怎么设置
2016/11/11 Javascript
jquery-mobile基础属性与用法详解
2016/11/23 Javascript
JS返回只包含数字类型的数组实例分析
2016/12/16 Javascript
Bootstrap table 定制提示语的加载过程
2017/02/20 Javascript
jquery easyui dataGrid动态改变排序字段名的方法
2017/03/02 Javascript
vue修改对象的属性值后页面不重新渲染的实例
2018/08/09 Javascript
在Vue-cli里应用Vuex的state和mutations方法
2018/09/16 Javascript
JavaScript常用数组操作方法,包含ES6方法
2020/05/10 Javascript
Vue.js样式动态绑定实现小结
2019/01/24 Javascript
vue+element实现表格新增、编辑、删除功能
2019/05/28 Javascript
vue 返回上一页,页面样式错乱的解决
2019/11/14 Javascript
javascript设计模式 ? 职责链模式原理与用法实例分析
2020/04/16 Javascript
nuxt.js写项目时增加错误提示页面操作
2020/11/05 Javascript
SpringBoot+Vue 前后端合并部署的配置方法
2020/12/30 Vue.js
[52:07]完美世界DOTA2联赛PWL S3 LBZS vs access 第二场 12.10
2020/12/13 DOTA
Python的加密模块md5、sha、crypt使用实例
2014/09/28 Python
Django中login_required装饰器的深入介绍
2017/11/24 Python
Python读取Json字典写入Excel表格的方法
2018/01/03 Python
解决Python网页爬虫之中文乱码问题
2018/05/11 Python
Pandas的read_csv函数参数分析详解
2019/07/02 Python
python操作excel让工作自动化
2019/08/09 Python
浅谈pandas.cut与pandas.qcut的使用方法及区别
2020/03/03 Python
Python request操作步骤及代码实例
2020/04/13 Python
详解CSS3伸缩布局盒模型Flex布局
2018/08/20 HTML / CSS
英国拳击装备购物网站:RDX Sports
2018/01/23 全球购物
职业生涯规划书范文
2014/03/10 职场文书
公司离职证明范本(汇总)
2014/09/10 职场文书
python装饰器代码解析
2022/03/23 Python
PostgreSQL数据库去除重复数据和运算符的基本查询操作
2022/04/12 PostgreSQL
MySQL数据库中的锁、解锁以及删除事务
2022/05/06 MySQL