不需要在 javascript 中转义 innerHTML 字符？

Posted 2023-05-07

【中文标题】不需要在 javascript 中转义 innerHTML 字符？

【英文标题】：no need to escape innerHTML characters in javascript?

【发布时间】：2013-01-03 01:07:12

【问题描述】：

我不应该转义“markup4”等中的双引号吗？令我惊讶的是，这个简单的作品。如果我用 &quot 代替它们，它不会。

<script type="text/javascript">

    function test3()
    document.getElementById('div21').innerhtml += '<div class = "markup4"><br>blablablabla1.<br><br></div><div class = "markup3"><br>blablabla2.<br><br></div>';
    

</script>

【问题讨论】：

它有效。以及 innerHTML = "".

是的，您不应该为此逃避报价。实际上 &quot 用于html。例如“是”将返回“是”

您不需要转义它，因为您的主字符串引号以 ' 开头，直到遇到另一个 ' 字符串才有效。和" != '

mavili，解释的很清楚，谢谢

【参考方案1】：

这些工作无需转义：

innerHTML = "<div class = 'markup4'>";
innerHTML = '<div class = "markup4">';

注意：当"在外面使用时，'在里面可以正常工作。 （和 相反）

这些需要转义：

innerHTML = '<div class = \'markup4\'>';
innerHTML = "<div class = \"markup4\">";

注意：当你在外部和内部使用双引号时，内部的 " 需要被\ 转义。 （单引号也一样）

这些会损坏：

innerHTML = "<div class = "markup4">";
innerHTML = '<div class = 'markup4'>';

【参考方案2】：

当你想在数据中包含引号时，应该使用转义，

例如：他说：“请使用这个！”应该像这样逃脱：

他说，\“请用这个！\”。

否则它们可以毫无问题地工作。

希望我已经澄清了。

【参考方案3】：

首先将字符串解析为内部 javascript 字符串表示，因此您首先需要为 javascript 字符串文字转义。这样做的结果将与您已经拥有的结果相同 - 因此无需修改。

现在你有

<div class = "markup4"><br>blablablabla1.<br><br></div><div class = "markup3"><br>blablabla2.<br><br></div>

在 javascript 内存中。

在此之后，就像您将其编写为普通 HTML 一样，所以当然，如果您使用 " 它将无法正常工作。

存储经过 2 种不同解释的字符串可能会变得非常复杂，这就是为什么您不应该这样做，而是使用模板引擎以及存储在其他文件中的模板或页面上的自定义脚本元素，这将允许您只关注 html 解释。

【参考方案4】：

不要忘记浏览器会根据您提供的内容呈现自己的 innerHtml，如果嵌套 innerHtml 代码可能会导致问题。

我发现 ' 和 " 代码在这里很有用。