将字符串与变量和转义字符连接起来答案

【问题标题】：concatenate string with variable and escape characters将字符串与变量和转义字符连接起来
【发布时间】：2020-06-20 01:27:00
【问题描述】：

我有这个js：

var title = "firts title isn't working";
var html = "<input type='text' value='${title}'>";

我想得到这个结果：

// "<input type='text' value='firts title isn't working'>"

但我明白了！！！

// "<input type='text' value='firts title isn' t='' working=''>"

【问题讨论】：

你是怎么做模板的？您自己的代码或模板引擎/库？
@JoshWulf jQuery 该值是用户输入，因此我必须将其添加为变量

标签： javascript html string variables concatenation

【解决方案1】：

谢谢大家，我这样解决了：

var title = "some data \" && \' "; // get it from user input

var chars_toEscape = {'\'':'&apos;', '\"':'&quot;', "\`":"&#96;"};
title = title.replace(/['"`]/g, char => chars_toEscape[char]);

var html = `<input type="text" value="${title}">`;

// as result input contain as value: some data " && '

【讨论】：

【解决方案2】：

如果你不需要单引号和双引号的混合，你可以在模板中使用双引号，然后文本中的单引号就可以了：

var title = "firts title isn't working";
var html = `<input type="text" value="${title}">`;
document.body.innerHTML=html;

否则 HTML 就是 HTML，正如@Barmar 指出的那样，它没有转义字符...
...但是，它有实体，然后你有两个，不管周围的：

var title = "&quot;firts&quot; title isn&apos;t working";
var html = `<input type='text' value='${title}'>`;
document.body.innerHTML=html;

（什么是firts？）

当然，您可以在代码中进行替换，这样您就可以拥有“可读”的字符串，并在以后.replace("\'","&apos;");它们。

【讨论】：

"（firts 是什么？） 拼写错误 first 我猜。
@VLAZ 是的，这只是一个例子
thx 先生，该值是用户输入，我使用（从 DB 中保存的值）生成输入并以模式显示，现在一切正常，但是当（存储的值）包含单个或双引号是问题发生的时间

【解决方案3】：

试试这个：

var title = "firts title isn't working";
var html = "<input type='text' value='"+title+"'>";
alert(html);

【讨论】：

【解决方案4】：

使用const。

使用转义字符串：

const title = "first title isn\\'t working";
const html = "<input type='text' value='${title}'>";

使用 ES6 模板字符串：

const title = `first title isn't working`;
const html = "<input type='text' value='${title}'>";

不确定第二个是否适合您。取决于您使用的模板功能。

你没有在你的问题中展示这两者是如何结合起来的，这将影响什么可行，什么不可行。

【讨论】：

您不需要在双引号字符串中转义单引号。
取决于使用的模板解决方案。它不是示例中的 ES6 模板，所以我假设其他东西正在做模板....
如果你想在字符串中使用文字反斜杠，你需要\\'
HTML 不允许在属性值中转义引号。
谢谢先生，我知道，但该值是用户输入，所以我必须将其添加为变量