也可以看我这篇文章
直接po图和代码(源代码贴在最后面了)
源代码我没怎么整理，大家凑合看吧！
以下可以正常读取json数据
以下是错误的写法，下面会贴源代码
下面贴源代码
testJson.jsp页面，这是显示数据的前端页面
<%@ page language="java" contentType="text/html; charset=utf-8"pageEncoding="utf-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>从mysql数据库中读取出数据并封装成json,显示在jsp页面上(数据库中的数据值中带了双引号和斜杠等这些特殊字符)</title><style type="text/css">div {background-color: #71C671;border-radius:5px;border:4px solid green;}.myDiv{background-color: #e3dfbf;border-collapse:collapse;text-align: center;width: 100%;border-collapse:separate;border-radius:8px;border:3px solid #800080;}input[type=button], input[type=submit], input[type=reset], button {background-color: #8E388E;border-radius: 4px;border: none;padding: 6px 8px;color: #fff;font-size: 16px;cursor: pointer;margin: 0px;line-height: normal;box-sizing: border-box;display: inline-block;text-align: center;vertical-align: middle;/*width:360px;*//*height: 50px;*/}input[type=text], input[type=password] {width: 600px;height: 32px;font-size: 20px;border: 2px solid #8E388E;border-radius: 4px; /*设置边框的4个直角变成圆角有弧度*/font-weight: bold; /*文本框中的文本字体加粗*/color: #0000a0;background-color: #ffff9f;}</style><script type="text/javascript">var testJson = {"userName":"t\om"};//经过测试，会打印出tomconsole.log(testJson.userName);//从request中取出json数据var myJsonStr = ${requestScope.jsonStr};console.log('myJsonStr=' + myJsonStr);console.log(myJsonStr);var jsonObj = eval(["新\"[笑傲江湖]\"","新{射雕英雄传}","天龙\"八\":部","明朝\\那些事","[三国演义]","康\\熙王\\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"]);console.log(jsonObj);console.log(jsonObj[0], jsonObj[1]);var jsonObj66 = eval((["新\"[笑傲江湖]\"","新{射雕英雄传}","天龙\"八\":部","明朝\\那些事","[三国演义]","康\\熙王\\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"]));console.log(jsonObj66);console.log(jsonObj66[2], jsonObj66[3]);//报错// var jsonObject = JSON.parse(["新\"[笑傲江湖]\"","新{射雕英雄传}","天龙\"八\":部","明朝\\那些事","[三国演义]","康\\熙王\\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"]);//报错// var jsonObject = JSON.parse('["新\"[笑傲江湖]\"","新{射雕英雄传}","天龙\"八\":部","明朝\\那些事","[三国演义]","康\\熙王\\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"]');var jsonObject = JSON.parse('["新\\"[笑傲江湖]\\"","新{射雕英雄传}","天龙\\"八\\":部","明朝\\\\那些事","[三国演义]","康\\\\熙王\\\\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"]');console.log(jsonObject);console.log(jsonObject[0],jsonObject[1], jsonObject[2], jsonObject[3]);//报错// var jsonObj1 = eval('["新\"[笑傲江湖]\"","新{射雕英雄传}","天龙\"八\":部","明朝\\那些事","[三国演义]","康\\熙王\\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"]');//报错// var jsonObj1 = eval('(["新\"[笑傲江湖]\"","新{射雕英雄传}","天龙\"八\":部","明朝\\那些事","[三国演义]","康\\熙王\\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"])');//在两边加上'单引号(即此时myJsonStr2变量是一个json格式的字符串)var myJsonStr2 = '${requestScope.jsonStr}';console.log('myJsonStr2=' + myJsonStr2);console.log(myJsonStr2);//报错// var jsonObj2 = eval('["新"[笑傲江湖]"","新{射雕英雄传}","天龙"八":部","明朝\那些事","[三国演义]","康\熙王\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"]');//报错// var jsonObj3 = eval('(["新"[笑傲江湖]"","新{射雕英雄传}","天龙"八":部","明朝\那些事","[三国演义]","康\熙王\朝","倚天屠龙记","萍踪侠影","雪山飞狐","???","水浒传"])');//报错// var jsonObj4 = eval("(" + myJsonStr2 + ")");window.onload = function() {// alert(myJsonStr.length);showDataToDiv("div1");showDataToDiv("div2");} //把数据展示到div标签中function showDataToDiv(tagId){var div1Node = document.getElementById(tagId);for (var index = 0; index < myJsonStr.length; index++) {var inputNode = document.createElement("input");var brNode = document.createElement("br");var br2Node = document.createElement("br");inputNode.type = "text";inputNode.size = 50;inputNode.value = myJsonStr[index];div1Node.appendChild(inputNode);div1Node.appendChild(brNode);div1Node.appendChild(br2Node);}}//给文本框赋值function setInputNodeValue(){var inputNode = document.getElementById("input1");inputNode.size = 60;//节点.value这种写法，效果是，直接给节点赋值(不会给节点添加value属性)inputNode.value = "江西省赣州市于都县";}//给文本框赋值function setInput2NodeValue(){var input2Node = document.getElementById("input2");input2Node.setAttribute("size", "60");//节点.setAttribute("value", "")这种写法，效果是，不但给节点赋值，还会给节点添加value属性input2Node.setAttribute("value", "我的家乡在江西省赣州市于都县");}</script></head><body><h2>从mysql数据库中读取出数据并封装成json,显示在jsp页面上(数据库中的数据值中带了双引号和斜杠等这些特殊字符)</h2><div id="div1"></div><div id="div2" class="myDiv"></div><input type="button" onclick="setInputNodeValue()" value="点击我，给文本框赋值"><input type="text" id="input1"><br><input type="button" onclick="setInput2NodeValue()" value="点击我，给文本框赋值"><input type="text" id="input2"></body></html>
下面是servlet(servlet名是TestJson)
package com.servlet;import java.io.IOException;import java.util.List;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import com.test.json.DBData;import net.sf.json.JSONArray;/*** 从mysql数据库中读取出数据并封装成json*/@WebServlet("/TestJson")public class TestJson extends HttpServlet {private static final long serialVersionUID = 1L;protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {DBData dbData = new DBData();List<String> data = dbData.getDBData();JSONArray jsonArray = JSONArray.fromObject(data);System.out.println("============从mysql数据库中读取出数据，封装成json============");System.out.println(jsonArray.isEmpty());String jsonStr = jsonArray.toString();System.out.println(jsonStr);request.setAttribute("jsonStr", jsonStr);//转发到testJson.jsp页面request.getRequestDispatcher("testJson.jsp").forward(request, response);}protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}}
下面是DBData类
package com.test.json;import java.sql.Connection;import java.sql.DriverManager;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;import java.util.ArrayList;import java.util.List;import net.sf.json.JSONArray;//从mysql数据库中读取出数据并封装成jsonpublic class DBData {public List<String> getDBData() {List<String> list = new ArrayList<String>();String connStr = "jdbc:mysql://localhost:3306/myemployees";// String sql = "select last_name, salary, email from employees";String sql = "select * from book";try {Class.forName("com.mysql.jdbc.Driver");Connection connection = DriverManager.getConnection(connStr, "root", "root");System.out.println("数据库连接=" + connection);PreparedStatement prepareStatement = connection.prepareStatement(sql);ResultSet rs = prepareStatement.executeQuery();int col = rs.getMetaData().getColumnCount();System.out.println("============================");while (rs.next()) {String str = rs.getString("bname");list.add(str);System.out.println(str);}System.out.println("============================");rs.close();prepareStatement.close();connection.close();} catch (ClassNotFoundException | SQLException e) {e.printStackTrace();}//System.out.println("list = " + list);//System.out.println("============从mysql数据库中读取出数据，封装成json============");//JSONArray jsonArray = JSONArray.fromObject(list);//System.out.println(jsonArray.isEmpty());//System.out.println(jsonArray.toString());return list;}}
如果觉得《javascript中eval函数和JSON.parse函数处理json中的引号和\斜杠转义字符》对你有帮助，请点赞、收藏，并留下你的观点哦！
