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 相关文章推荐
JQuery下关于$.Ready()的分析
Dec 13 Javascript
JavaScript 设计模式 富有表现力的Javascript(一)
May 26 Javascript
Easy.Ajax 部分源代码 支持文件上传功能, 兼容所有主流浏览器
Feb 24 Javascript
在myeclipse中如何加入jquery代码提示功能
Jun 03 Javascript
json实现前后台的相互传值详解
Jan 05 Javascript
jQuery自定义图片缩放拖拽插件imageQ实现方法(附demo源码下载)
May 27 Javascript
JS如何判断json是否为空
Jul 06 Javascript
js删除数组元素、清空数组的简单方法(必看)
Jul 27 Javascript
jquery无法为动态生成的元素添加点击事件的解决方法(推荐)
Dec 26 Javascript
深入理解JavaScript的async/await
Aug 05 Javascript
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
echarts.js 动态生成多个图表 使用vue封装组件操作
Jul 19 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
生成缩略图
2006/10/09 PHP
php从文件夹随机读取文件的方法
2015/06/01 PHP
php mysqli查询语句返回值类型实例分析
2016/06/29 PHP
JQuery学习笔记 nt-child的使用
2011/01/17 Javascript
JS TextArea字符串长度限制代码集合
2012/10/31 Javascript
TextArea设置MaxLength属性最大输入值的js代码
2012/12/21 Javascript
js 取时间差去掉周六周日实现代码
2012/12/25 Javascript
jquery预览图片实现鼠标放上去显示实际大小
2014/01/16 Javascript
JS 循环li添加点击事件 (闭包的应用)
2016/12/10 Javascript
JavaScript奇技淫巧44招【实用】
2016/12/11 Javascript
NodeJS处理Express中异步错误
2017/03/26 NodeJs
jQuery常见面试题之DOM操作详析
2017/07/05 jQuery
解决Angular.js中使用Swiper插件不能滑动的问题
2018/02/26 Javascript
javascript设计模式 ? 策略模式原理与用法实例分析
2020/04/21 Javascript
JavaScript中window和document用法详解
2020/07/28 Javascript
[03:31]DOTA2英雄基础教程 大地之灵
2013/12/17 DOTA
让Django支持Sql Server作后端数据库的方法
2018/05/29 Python
Django forms组件的使用教程
2018/10/08 Python
python同时遍历数组的索引和值的实例
2018/11/15 Python
python视频按帧截取图片工具
2019/07/23 Python
python 魔法函数实例及解析
2019/09/25 Python
关于pytorch中全连接神经网络搭建两种模式详解
2020/01/14 Python
django orm模块中的 is_delete用法
2020/05/20 Python
Python使用struct处理二进制(pack和unpack用法)
2020/11/12 Python
新西兰珠宝品牌:Michael Hill
2017/09/16 全球购物
女子锻炼服装和瑜伽服装:Splits59
2019/03/04 全球购物
Farfetch澳大利亚官网:Farfetch Australia
2020/04/26 全球购物
给女朋友的道歉信
2014/01/10 职场文书
军神教学反思
2014/02/04 职场文书
情人节活动策划方案
2014/02/27 职场文书
促销活动计划书
2014/05/02 职场文书
2015年安全生产责任书
2015/01/30 职场文书
好员工观后感
2015/06/17 职场文书
Java 泛型详解(超详细的java泛型方法解析)
2021/07/02 Java/Android
关于CentOS 8 搭建MongoDB4.4分片集群的问题
2021/10/24 MongoDB
SQL Server数据库基本概念、组成、常用对象与约束
2022/03/20 SQL Server