Javascript 将html代码替换为文本后，文本将转换为html并被执行，如何防止它？

在页面上，您可以创建新的博客，在编辑器中，您可以插入例如

<p>MyWord <img src=x onerror=alert(something)></p>

---

因此，我怀疑编辑器阻止了html字符串的执行，但在我替换单词后，字符串将作为html代码插入到DOM中。有什么方法可以防止这种情况发生吗？

jQuery的

.replaceWith（）

方法将替换内容视为HTML，如果它是字符串，则将其呈现为纯文本

不替换元素，只需指定给文本节点的

nodeValue

如果只在DOM元素上循环一次，然后在其中执行所有文本替换，也会更好

function replaceStr(myStrArr) {
  const container = $('body :not(script)');
  container
    .contents()
    .each((_, el) => {
      if (el.nodeType == 3) {
        el.nodeValue = myStrArr.reduce(({
          reg,
          newStr
        }, text) => text.replace(reg, newStr), el.nodeValue);
      }
    });
}

---

我不确定我是否理解你的逻辑。当脚本标记不存在时，脚本是如何执行的？如果不使用返回值，则应使用

.each（）

而不是

.map（）

。@bam例如，您创建了一篇新文章，并将文本写入网页的编辑器中，文本中有“MyWord

”，保存文章后，您将看到字符串“MyWord

”作为文本。但是，如果运行上述脚本并用其他内容替换MyWord，则“

”将消失，只有替换的word保留下来并执行警报，只有当p在单词周围且img在p内时才会发生这种情况。替换DOM节点时，htmlstring将从文本转换为实际的html代码，因此“MyWord

”不再是文本字符串。只有替换的单词是文本字符串，“

”是实际的html代码。您好，首先感谢您的回答。但是如果我想在替换的单词周围加一个圈来改变单词的颜色呢。那我怎么做呢？例如，我想用“NewWord”替换“MyWord”，以便突出显示替换的单词。不要替换文本节点，而是替换容器的HTML。当您提取容器的HTML时，文本

将转换为实体

和

。再次感谢Barmar，但这太复杂了。我添加了我的第一篇帖子，使用了我正在使用的1:1函数。你能再看一下吗。所以我从容器中排除“$”（“body:not（script）：not（.myClass）；”脚本和.myClass，因为我不想替换<>中的任何内容，比如类名，也不想替换已经被替换的单词。例如，如果您查找'word'和'wordnext'，那么如果我不排除myClass，那么它将替换'wordnext'中的'word'。然后是wordnext应该是wordnextSorry这很复杂，至少对我来说，我花了一些时间来解决这个问题。如果我使用您的解决方案，则“

”不会转换为html。太好了。但我如何让我的span是html代码呢？不理解您的上一条评论。

$（element）.html（函数（u，oldHTML）{返回oldHTML.replace（reg，newStr）；}）

function replaceStr(myStrArr) {
  const container = $('body :not(script)');
  container
    .contents()
    .each((_, el) => {
      if (el.nodeType == 3) {
        el.nodeValue = myStrArr.reduce(({
          reg,
          newStr
        }, text) => text.replace(reg, newStr), el.nodeValue);
      }
    });
}