javascript 替换无法使用“<”答案

【问题标题】：javascript replace fails to work with "<"javascript 替换无法使用“<”
【发布时间】：2015-02-18 00:35:20
【问题描述】：

我正在尝试使用 javascript 的替换函数替换字符串中的 "<" 和 ">"。我是这样使用的：

<html>
<body onload="myFunction()">
<p id="demo">#include <iostream></p>

<script>
function myFunction() {
    var str = document.getElementById("demo").innerHTML; 
    var res = str.replace(/</g, '&lt; ').replace(/>/g, '&gt; ');
    document.getElementById("demo").innerHTML = res;
}
</script>

</body>
</html>

我希望输出为"#include <iostream>"，但相应的</iostream> 会附加到所需的输出。

发生了什么事？如何避免这种行为？

【问题讨论】：

你是否在 html 中转义了？如果没有，请将 '' 与 >。如果不转义文本，浏览器会将视为标签，并适当地关闭它。
它被解释为 HTML，<iostream> 标签打开但未关闭，然后<p> 关闭，使解释器为@987654328 插入关闭标签@.
您是否首先尝试过有效的 HTML？
@asmeltseg 让我告诉你，JS 不是解决这个问题的正确方法。
@asmeltseg 这个替换应该在用户看到任何东西之前在服务器端完成

标签： javascript html replace

【解决方案1】：

因为您的 html 中有 <iostream>，所以它在您的浏览器中被解释为一个标签，它添加了一个额外的结束 </iostream>。看起来好像您正在尝试使用 JS 对其进行转义，但为时已晚，因为您的浏览器在 javascript 之前加载了 html，并添加了额外的结束标记。在你的 html 中转义它以避免额外的结束标记被附加行为：

<p id="demo">#include &lt;iostream&gt;</p>

我只想分别用&lt; 和&gt; 自动替换“”。 @rioc0719：我不想手动替换。`

请不要尝试用 JS 来做这件事。获取为您完成此任务的 IDE。地狱，为你做一个服务器端脚本；只是不要为此使用 JS，一种客户端语言，。

【讨论】：

【解决方案2】：

2 个问题的答案

带有“innerHTML”的自动关闭标签：找到Javascript - .innerHTML changes auto close tags
替换“”使用textContent

<html>
<body onload="myFunction()">
<p id="demo">#include <iostream> </p>


<script>
function myFunction() {
    var str = document.getElementById("demo").innerHTML; 
    var res = str.replace(/</g, '&lt; ').replace(/>/g, '&gt; ');
    document.getElementById("demo").textContent  = res;
}
 
</script>

</body>
</html>

【讨论】：