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 选择器理解
Mar 16 Javascript
Javascript Function对象扩展之延时执行函数
Jul 06 Javascript
解决node-webkit 不支持html5播放mp4视频的方法
Mar 11 Javascript
JavaScript如何动态创建table表格
Aug 02 Javascript
jquery层级选择器的实现(匹配后代元素div)
Sep 05 Javascript
原生js实现瀑布流布局
Mar 08 Javascript
详解webpack和webpack-simple中如何引入css文件
Jun 28 Javascript
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
Nov 04 Javascript
vue中实现高德定位功能
Dec 03 Javascript
Vue项目配置跨域访问和代理proxy设置方式
Sep 08 Javascript
vue 使用vant插件做tabs切换和无限加载功能的实现
Nov 04 Javascript
JavaScript实现简单计时器
Jun 22 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来处理多个提交任务
2008/05/08 PHP
php 分页原理详解
2009/08/21 PHP
使用session判断用户登录用户权限(超简单)
2013/06/08 PHP
php生成4位数字验证码的实现代码
2015/11/23 PHP
PHP面向对象程序设计之接口的继承定义与用法详解
2018/12/20 PHP
纯js实现的论坛常用的运行代码的效果
2008/07/15 Javascript
Mootools 1.2教程 输入过滤第二部分(字符串)
2009/09/15 Javascript
各浏览器对link标签onload/onreadystatechange事件支持的差异分析
2011/04/27 Javascript
用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数
2012/01/21 Javascript
jQuery中RadioButtonList的功能及用法实例介绍
2013/08/23 Javascript
jquery实现文本框textarea自适应高度
2016/03/09 Javascript
JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解
2016/11/29 Javascript
详解AngularJS1.6版本中ui-router路由中/#!/的解决方法
2017/05/22 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
2018/02/01 Javascript
微信小程序 wepy框架与iview-weapp的用法详解
2019/04/10 Javascript
JS使用正则表达式提交页面验证的代码
2019/10/16 Javascript
详解Vue3 Composition API中的提取和重用逻辑
2020/04/29 Javascript
jQuery--遍历操作实例小结【后代、同胞及过滤】
2020/05/22 jQuery
IDEA配置jQuery, $符号不再显示黄色波浪线的问题
2020/10/09 jQuery
Python解析xml中dom元素的方法
2015/03/12 Python
python利用高阶函数实现剪枝函数
2018/03/20 Python
pygame实现成语填空游戏
2019/10/29 Python
python输出数组中指定元素的所有索引示例
2019/12/06 Python
keras模型可视化,层可视化及kernel可视化实例
2020/01/24 Python
JavaScript+Canvas实现自定义画板的示例代码
2019/05/13 HTML / CSS
医生自荐信
2013/10/11 职场文书
历史系自荐信范文
2013/12/24 职场文书
微型企业创业投资计划书
2014/01/10 职场文书
护士个人自我鉴定
2014/03/24 职场文书
计算机专业毕业生求职信
2014/04/30 职场文书
质量月活动总结
2014/08/26 职场文书
见习报告格式要求
2014/11/04 职场文书
2014年计生协会工作总结
2014/11/21 职场文书
2015年实习班主任工作总结
2015/04/23 职场文书
2019大学毕业晚会主持词
2019/06/21 职场文书