Javascript 替换和正则表达式异常

我想将文本中的所有单词包装在

标记中，以便能够处理每个单词。悬停它们，点击翻译等等

为此，我需要在replace函数中出现一个异常，以忽略html标记，如

或

以下是我的功能：

function wrapWords(str, tmpl) {
  return str.replace(/(?![<br>\<span class="gras">\</span>])[a-zA-ZÀ-ÿ]+/gi, tmpl || "<trans>$&</trans>");
}

函数包装词（str，tmpl）{
返回str.replace（/（？！[
\\]）[a-zA-ZÀ-ÿ]+/gi，tmpl | |“$&”）；
}

此函数适用于俄语字符，但不适用于法语字符。问题是

和

例外不包括法语字符b、r、s、p、a。。。因此，我的

标记中的某些单词没有正确包装

有人知道我如何排除一组字符，例如特定标记

，而不影响法语中的字母b和r吗

谢谢你的回答

这里有一个快速方法：

"foo bar baz".split(" ").map(w => "<trans>" + w + "</trans>").join(" ");

sourceTextNode是：

<div>
  <trans>foo</trans>
  <trans>bar</trans>
  <trans>baz</trans>
</div>

---

如果正确地使用DOM，它会稍微复杂一些，但不需要担心什么特殊情况，因为它非常简单

您希望分割文本，因此仅对文本节点进行操作是有意义的。为了找到所有的文本节点，我们可以计算XPath，或者构造一个

TreeWalker

一旦我们知道要在哪些节点上操作，我们一次只取一个节点，得到所有的空间序列，没有空间序列。每个节点都将转换为另一个文本节点，但无空格序列将另外包装在

中。我们将它们一个接一个地附加到原始节点的前面，这将保证正确的顺序，然后当替换节点都就位时，最后我们将删除原始节点

函数getTextNodes（节点）{ 让walker=document.createTreeWalker（node，NodeFilter.SHOW_TEXT，null，false）； 设textnodes=[]； 让textnode； while（textnode=walker.nextNode（））{ textnodes.push（textnode）； } 返回文本节点； } 函数换行（元素）{ getTextNodes（元素）.forEach（节点=>{ node.textContent.replace（/（\S+）|（\S+）/g，（匹配，单词，空格）=>{ 让textnode=document.createTextNode（匹配）； 让newnode； 如果（字）{ newnode=document.createElement（'trans'）； appendChild（textnode）； }否则{ newnode=textnode； } node.parentNode.insertBefore（newnode，node）； }); node.remove（）； }); } wrap（document.getElementById（'wrapthis'）

trans{
背景颜色：粉红色；
}

不受影响

这会受到影响

HTML标记很好

这也是

不受影响

为什么要尝试使用正则表达式解析HTML，而事实上JavaScript本身已经是一个HTML解析器了？

[
\\]

不是您想象的那样。事实上，它相当于

[“\/\\abcglnprs]

（尽管我肯定会听Tim的，并正确解析HTML）Zim非常感谢您让我了解正确的方法来做这些事情。您的代码运行良好，现在我将对其进行分析以详细了解。请注意，这将删除您正在转换的节点中可能存在的任何现有HTML标记。是的，这是一个非常不充分的答案，因为它仅适用于纯文本。因此“捷径“引言…@Amadan的回答应该是可以接受的。但在紧急情况下，你可以用简单的方法；）非常感谢阿玛丹为我展示了另一种做事的方式。我会处理它，并让你知道结果。你的代码运行得很好。它的工作原理对我来说仍然很模糊，但我开始理解firefox文档和其他文档。然后，我会尝试将其定制为包装句子，而不仅仅是单词。句子更难，因为它们可以按元素分割，甚至可以处于不同的层次。注意<代码>注释：这是一个句子。请参见？，在这里，不可能将句子包装起来。

<div>
  <trans>foo</trans>
  <trans>bar</trans>
  <trans>baz</trans>
</div>

sourceText.split(" ").filter(Boolean)...