Javascript 方法是否自动转义引号？

Question

我想知道 javascript 方法是否自动转义引号，因为这段代码有效：

示例 #1

<?php $foo ="hey a quote ' "; ?>
<input type="text" value="<?php echo $foo; ?>" id="foo" />
<script>
    bar = document.getElementById('foo').value;
    alert(bar+'there is a quote, will it work? ,');
</script>

它显示警报正常，但是这个：

示例 #2

<?php $foo ="hey a quote ' "; ?>
<button onclick="alert('<?php echo $foo; ?>');">test</button>

...没有。 很明显，这是因为引号没有用 \.

转义

但话又说回来，第一个例子中也不是，那为什么会这样呢？ javascript 的方法在从 DOM 中选取内容时是否自动转义引号？

或者只是 value() 方法？

我什么都没找到，所以如果你有答案，我会很高兴。

Answer 1

PHP 在服务器上处理，生成 HTML（在这种情况下包括嵌入的 javascript）。这发生在 HTML 被发送到浏览器进行解释之前，包括任何 JS。

如果检查生成的 HTML 源代码，您将看到第二个示例变为：

<button onclick="alert('hey a quote ' ');">test</button>

这不是有效的 JS 语法。

您的第一个版本基本上可以工作，因为您在插入 PHP 字符串的代码中没有多余的单引号。插入会产生：

<input type="text" value="hey a quote ' " id="foo" />

非常好。然后将该值传递给 JS 中的 alert 调用。

Answer 2

不同之处在于，在第一个代码示例中，引号出现在没有换行单引号的上下文中，因此没有歧义。如果您将 HTML 属性值用单引号括起来（HTML 也是有效的），您就会遇到问题：

<?php $foo ="hey a quote ' "; ?>
<input type='text' value='<?php echo $foo; ?>' id='foo' />

在那种情况下，单引号应该作为 HTML 实体转义：':

<?php $foo ="hey a quote &apos; "; ?>
<input type='text' value='<?php echo $foo; ?>' id='foo' />

现在，在您提供的第二个代码示例中，单引号将出现在包裹的单引号中（对于传递给 alert 的字符串文字）。这是一个问题，因为单引号现在将 end 字符串文字，它后面的字符将导致语法错误。

此处引号出现在 JavaScript 字符串文字（alert 代码）中，而不是第一个示例的 HTML 上下文中。在 JavaScript 字符串文字中，单引号可以用反斜杠转义。

所以在这两种情况下（HTML 或 JavaScript）你可能需要一种转义形式。他们是不同的。

请注意，其中 none 与 PHP 有关。

Javascript 方法是否自动转义引号？

Does Javascript methods auto-escape quotes?

javascript

html

dom

quotes