Servlet返回的數據js解析問題

時間 2020-06-02

標籤 servlet 返回數據解析問題欄目 Tomcat 简体版

原文原文鏈接

Servlet返回的數據js解析問題javascript

方式1：Jsonhtml

接收函數：ajax.responseText後面沒括號java

其實在以前所說的ajax中還遺留了一些問題就是，Servlet返回給js的數據是如何被js解析的呢？ajax

以前只是發送了一句話，因此他就以html的格式進行解析就成功了，可是在實際中咱們每每發送的數據是存在一個對象當中的又或者是一組對象當中的，咱們應該如何發送呢？json

json：js當中有一種有一種結構就是json，說白了就是鍵值對。jsp

例以下面的：函數

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

咱們能夠在Servlet將屬性與值進行拼接，獲得json格式的字符串，這樣js中就能以這樣的格式進行數據的解析了。學習

相似於下面這樣：測試

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

可是對於懶癌來講這樣的方式是極不友好的，因此就要說到強大的jar包了。ui

有一款名爲gson的jar包能夠幫你完成拼接的工做：https://pan.baidu.com/s/1-_lhLxGspqCis5CAPKt-GA

對於使用就是你直接將對象丟進去就好，它會自動幫你轉爲json格式。

而後又有問題來了，json的數據給js有什麼用，咱們通常操縱的是對象呀！

別慌，eval幫你解決

方式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>