如何在 JavaScript 中转义单引号 ( ' )?

IT技术 javascript html escaping
2021-01-24 02:14:26

更新: 我想对这个问题给出更新的答案。首先,让我说明一下,如果您正在尝试完成我在下面所做的工作,我建议您改为通过添加事件侦听器管理事件我强烈建议你在你的项目中使用jQuery,并使用它们的语法来管理事件监听器而不是使用 DOM。

问题

好的,我基本上是这样做的:

document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(\'ex1\')' />";

我不想在我放置 \' 的地方使用双引号 (")。我只想要一个单引号,所以我试图在使用它时不让它加双引号。我试图在最终结果中达到这一点.

<img src="something" onmouseover="change('ex1')" />

逃避对我不起作用。

我的标记答案效果很好,但是,更干净(更专业的方式,IMO)是 loganfsmyth's answer

5个回答

您应该始终考虑浏览器最终会看到什么。在这种情况下,它会看到:

<img src='something' onmouseover='change(' ex1')' />

换句话说,“onmouseover”属性只是change(,还有另一个ex1')'没有值的“属性”被调用

事实是,HTML 不\用于转义字符。但它确实分别识别&quot;&apos;作为转义引号和撇号。

有了这些知识,使用这个:

document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(&quot;ex1&quot;)' />";

...话虽如此,您可以只使用 JavaScript 引号:

document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(\"ex1\")' />";
先生,如果我写<input type = "button" value ="pressme" onclick= 'alert('hello')' >的不起作用,但如果我将其更改为"alert('hello')" 那么它为什么会这样?
2021-03-13 02:14:26
好吧。我犯了一个用户错误...放在错误的位置。
2021-03-20 02:14:26
试过了。它仍然给了我 undefined 而不是给了我的value ex1
2021-03-30 02:14:26
@SurajJain 你读过答案了吗?
2021-04-06 02:14:26
……或者,更好的是,根本不使用内联属性处理程序;特别是在通过 javascript 创建的元素上。
2021-04-08 02:14:26

这里的答案很简单:

您已经将它包含在双引号中,因此无需使用\.

如果要在单引号字符串中转义单引号:

var string = 'this isn\'t a double quoted string';
var string = "this isn\"t a single quoted string";
//           ^         ^ same types, hence we need to escape it with a backslash

或者,如果你想转义\',你可以转义 bashslash\\和引用\'这样的:

var string = 'this isn\\\'t a double quoted string';
//                    vvvv
//                     \ ' (the escaped characters)

但是,如果包含具有不同引号类型的字符串,则无需转义:

var string = 'this isn"t a double quoted string';
var string = "this isn't a single quoted string";
//           ^        ^ different types, hence we don't need escaping
谢谢,你能告诉我行高是多少吗?
2021-03-21 02:14:26
@SurajJain 首先,您不应该在警报中使用引号 - 您正在输出文本值,其次您应该转义引号或在脚本中更改它们的类型。
2021-03-27 02:14:26
@SurajJain 这里的评论对于任何类型的无关讨论都不是很好,但行高是行的高度。您可以查看line-heightMDN 上条目
2021-03-30 02:14:26
先生<input type = "text" value = "abc" id="text"/> <input type = "button" value ="pressme" onclick= "alert('getElementById("text").value')" > 这不起作用你能指出一个错误吗?
2021-04-08 02:14:26

你可以'像在 JavaScript 中转义 a\'

由于值实际上在 HTML 属性内,您应该使用 &apos;

"<img src='something' onmouseover='change(&apos;ex1&apos;)' />";
谢谢.. 我试过一次,但我想我可能会把它放在最糟糕的位置。
2021-03-14 02:14:26
这解决了我的问题。谢谢你。
2021-03-28 02:14:26
当我尝试在 text/x-template 中使用时,这对我有用。
2021-03-30 02:14:26
    document.getElementById("something").innerHTML = "<img src=\"something\" onmouseover=\"change('ex1')\" />";

或者

    document.getElementById("something").innerHTML = '<img src="something" onmouseover="change(\'ex1\')" />';

它应该工作...