如何从 JavaScript 读取/访问 JSP 变量？
从 JavaScript 读取 JSP 变量
IT技术
java
javascript
jsp
2021-01-22 20:26:02
6个回答
alert("${variable}");
或者
alert("<%=var%>");
或完整示例
<html>
<head>
<script language="javascript">
function access(){
<% String str="Hello World"; %>
var s="<%=str%>";
alert(s);
}
</script>
</head>
<body onload="access()">
</body>
</html>
注意：在渲染之前清理输入，它可能会打开很多 XSS 的可能性
据我所知，最干净的方法是：
- 将您的 JSP 变量添加到 HTML 元素的 data-* 属性
- 然后在需要时通过 Javascript 读取这个值
我对这个 SO 页面上当前解决方案的看法：在实际的 javascript 代码中使用 java 脚本“直接”读取 JSP 值可能是你能做的最恶心的事情。让我想吐。哈哈。说真的，尽量不要这样做。
没有 JSP 的 HTML 部分：
<body data-customvalueone="1st Interpreted Jsp Value" data-customvaluetwo="another Interpreted Jsp Value">
Here is your regular page main content
</body>
使用 JSP 时的 HTML 部分：
<body data-customvalueone="${beanName.attrName}" data-customvaluetwo="${beanName.scndAttrName}">
Here is your regular page main content
</body>
javascript 部分（为简单起见使用 jQuery）：
<script type="text/JavaScript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.js"></script>
<script type="text/javascript">
jQuery(function(){
var valuePassedFromJSP = $("body").attr("data-customvalueone");
var anotherValuePassedFromJSP = $("body").attr("data-customvaluetwo");
alert(valuePassedFromJSP + " and " + anotherValuePassedFromJSP + " are the values passed from your JSP page");
});
</script>
这里是 jsFiddle 看到这个在行动http://jsfiddle.net/6wEYw/2/
资源：
- HTML 5 data-* 属性：https : //developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes
- 将 javascript 包含到 html 文件中在 HTML 中包含 JavaScript 文件将不能作为 <script .... />
- CSS 选择器（通过 jQuery 选择时也可用）https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started/Selectors
- 通过 jQuery http://api.jquery.com/attr/获取 HTML 元素属性
假设您正在谈论 HTML 文档中的 JavaScript。
您不能直接执行此操作，因为就 JSP 而言，它正在输出文本，而就页面而言，它只是获取一个 HTML 文档。
您必须生成 JavaScript 代码来实例化变量，注意转义JS 中具有特殊含义的任何字符。如果您只是转储数据（如其他一些答案所建议的那样），您会发现当数据包含新行、引号字符等时它会倒塌。
最简单的方法是使用 JSON 库（在http://json.org/底部列出了一堆），然后有 JSP 输出：
<script type="text/javascript">
var myObject = <%= the string output by the JSON library %>;
</script>
这将为您提供一个可以访问的对象，例如：
myObject.someProperty
在 JS 中。
<% String s="Hi"; %>
var v ="<%=s%>";
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
<title>JSP Page</title>
<script>
$(document).ready(function(){
<% String name = "phuongmychi.github.io" ;%> // jsp vari
var name = "<%=name %>" // call var to js
$("#id").html(name); //output to html
});
</script>
</head>
<body>
<h1 id='id'>!</h1>
</body>