如何在动态javascript文件中安全地嵌入动态HTML，以便它不会破坏javascript

Question

我需要动态构建一个javascript文件并在其中嵌入一些html，这样在运行时，javascript就能将html添加到DOM中。

我有一个javascript.js，我可以使用wicket进行插值。它包含：

var html = "${somehtml}"

document.write(html);

目前，如果我用包含单引号的html替换${somehtml}，它显然会破坏html。

我尝试使用URLEncoder.encode()和javascript unescape()，但这打破了javascript。

我想知道我是否可以对base64进行编码/解码？或者还有另一种解决方案吗？

Answer 1

首先用两个反斜杠替换每个反斜杠，然后用反斜杠和引号替换每个引号。像

这样的东西

var newstring = mystring.replace(/\\/g, "\\\\").replace(/"/g, '\\"');

Answer 2

Apache Commons提供了一个名为StringEscapeUtils的辅助类。它可以对字符串进行编码，以便可以安全地嵌入到javascript（ecmascript）中。

Answer 3

我怀疑这是你正在寻找的东西，因为你正在构建js，但嵌入式javascript文件（* .ejs）允许你从外部文件加载标记（可选择通过也是自定义数据而不是把所有内容放在引号中，看起来一般都很乱。

它至少对开发有用，但我宁愿不必向客户端发送更多文件。

http://embeddedjs.com/

<ul>
<% for(var i=0; i<supplies.length; i++) {%>
   <li><%= supplies[i] %></li>
<% } %>
</ul>

与

someVar += "<ul>";
for(var i=0; i<supplies.length; i++) {
    someVar += "<li>" + supplies[i] + "</li>";
}
someVar += "</ul>";