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题目,重写函数让其无限相加
Feb 15 Javascript
jQuery遍历Table应用示例
Apr 09 Javascript
nw.js实现类似微信的聊天软件
Mar 16 Javascript
基于jQuery实现仿微博发布框字数提示
Jul 27 Javascript
js print打印网页指定区域内容的简单实例
Nov 01 Javascript
vue.js实现刷新当前页面的方法教程
Jul 05 Javascript
easyui datagrid 表格中操作栏 按钮图标不显示的解决方法
Jul 27 Javascript
JS如何获取地址栏的参数实例讲解
Oct 06 Javascript
Vue拖拽组件列表实现动态页面配置功能
Jun 17 Javascript
微信小程序实现点击卡片 翻转效果
Sep 04 Javascript
Node中对非阻塞I/O、事件循环的知识点总结
Jan 05 Javascript
React Ant Design树形表格的复杂增删改操作
Nov 02 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
MySQL时间字段究竟使用INT还是DateTime的说明
2012/02/27 PHP
php中preg_replace_callback函数简单用法示例
2016/07/21 PHP
php微信开发之自定义菜单实现
2016/11/18 PHP
php获取访问者浏览页面的浏览器类型
2017/01/23 PHP
关于Laravel-admin的基础用法总结和自定义model详解
2019/10/08 PHP
Mootools 1.2教程 排序类和方法简介
2009/09/15 Javascript
JavaScript中的Primitive对象封装介绍
2014/12/31 Javascript
推荐一款jQuery插件模板
2015/01/09 Javascript
原生JavaScript制作微博发布面板效果
2016/03/11 Javascript
javascript简单进制转换实现方法
2016/11/24 Javascript
基于JS实现的随机数字抽签实例
2016/12/08 Javascript
使用BootStrap进行轮播图的制作
2017/01/06 Javascript
简单实现js无缝滚动效果
2017/02/05 Javascript
微信小程序 两种为对象属性赋值的方式详解
2017/02/23 Javascript
关于vue.js过渡css类名的理解(推荐)
2017/04/10 Javascript
JavaScript中使用webuploader实现上传视频功能(demo)
2017/04/10 Javascript
javascript获取指定区间范围随机数的方法
2017/09/08 Javascript
在layui框架中select下拉框监听更改事件的例子
2019/09/20 Javascript
用Python解决计数原理问题的方法
2016/08/04 Python
Java分治归并排序算法实例详解
2017/12/12 Python
Python 微信爬虫完整实例【单线程与多线程】
2019/07/06 Python
pandas分组聚合详解
2020/04/10 Python
python多线程实现同时执行两个while循环的操作
2020/05/02 Python
用python获取txt文件中关键字的数量
2020/12/24 Python
纯CSS3制作漂亮带动画效果的主机价格表
2015/04/25 HTML / CSS
CSS3实现滚动条动画效果代码分享
2016/08/03 HTML / CSS
使用phonegap查找联系人的实现方法
2017/03/31 HTML / CSS
亚马逊海外购:亚马逊美国、英国、日本、德国直邮
2021/03/18 全球购物
某公司C#程序员面试题笔试题
2014/05/26 面试题
电子商务自荐书范文
2014/01/04 职场文书
《九色鹿》教学反思
2014/02/27 职场文书
市级绿色学校申报材料
2014/08/25 职场文书
2014迎国庆演讲稿
2014/09/19 职场文书
交通运输局四风问题对照检查材料思想汇报
2014/10/09 职场文书
叶问观后感
2015/06/15 职场文书
Android使用EventBus发送消息,Fragment中接收消息的方法会执行多次
2022/04/24 Java/Android