使用 js 正则表达式将 **bold** 等简单标记样式替换为 bold答案

【问题标题】：Using js regex to replace simple markup styles like **bold** to bold使用 js 正则表达式将 **bold** 等简单标记样式替换为 bold
【发布时间】：2013-06-05 18:44:54
【问题描述】：

我正在尝试获取一大段纯文本并将其中的一部分转换为 html 标记。我不需要一个完整的富编辑器，只需要这几个标签：

**bold**
__underline__
~~italics~~
--strike--
<<http://www.link.com>>

这是我尝试编写的方法，但我缺乏 regex/js 似乎阻碍了它：

function toMarkup($this) {
    var text = $this.text();
    text = text.replace("\*\*(.*)\*\*", "<b>$1</b>");
    text = text.replace("__(.*)__", "<u>$1</u>");
    text = text.replace("~~(.*)~~", "<i>$1</i>");
    text = text.replace("--(.*)--", "<del>$1</del>");
    text = text.replace("<<(.*)>>", "<a href='$1'>Link</a>");
    $this.html(text);
}

关于为什么这些替换不起作用的任何明显错误？我刚刚意识到的另一个问题是，通过将此文本转换为 html，我正在转义任何其他可能是恶意的潜在标签。奖励将是关于如何只逃避这些元素而不是其他任何建议。

【问题讨论】：

“关于为什么这些替换不起作用的任何明显错误”。是的，因为那些不是正则表达式，只是字符串。

标签： javascript regex text

【解决方案1】：

首先，它们只是字符串，而不是正则表达式。其次你应该使用不贪婪的.*。

此外，您可能希望使用g 修饰符来匹配文本中的每个出现。

function toMarkup($this) {
    var text = $this.text();
    text = text.replace(/\*\*(.*?)\*\*/g, "<b>$1</b>");
    text = text.replace(/__(.*?)__/g, "<u>$1</u>");
    text = text.replace(/~~(.*?)~~/g, "<i>$1</i>");
    text = text.replace(/--(.*?)--/g, "<del>$1</del>");
    text = text.replace(/<<(.*?)>>/g, "<a href='$1'>Link</a>");
    $this.html(text);
}

【讨论】：

不要忘记将? 添加到您的第一个正则表达式中以使其变得懒惰。
谢谢，我什至没有注意到差异
这不允许**S***应该是S*
@T.Woody 如果有必要，您可以使用/\*\*(\**.*?\**)\*\*/，虽然不那么可读。最好的正则表达式实际上是：/\*\*(\**[\s\S]*?\**)\*\*/g.

【解决方案2】：

使用 Regexp 对象作为 text.replace() 的第一个参数而不是字符串：

function toMarkup($this) {
    var text = $this.text();
    text = text.replace(/\*\*(.*?)\*\*/g, "<b>$1</b>");
    text = text.replace(/__(.*?)__/g, "<u>$1</u>");
    text = text.replace(/~~(.*?)~~/g, "<i>$1</i>");
    text = text.replace(/--(.*?)--/g, "<del>$1</del>");
    text = text.replace(/<<(.*?)>>/g, "<a href='$1'>Link</a>");
    $this.html(text);
}

请注意，我还将所有.* 替换为.*?，这将匹配尽可能少的字符，否则您的匹配可能会太长。例如，您将从第一个 ** 匹配到最后一个 **，而不是停在下一个。正则表达式还需要 g 标志，以便替换所有匹配项（感谢 Aaron）。

【讨论】：

不要忘记这些正则表达式上的 /g 修饰符。

【解决方案3】：

 function toMarkup($this) {
   $this.html ($this.text ().replace (/(__|~~|--|\*\*)(.*?)\1|<<(.*?)>>\/g, 
     function (m, m1, m2, m3) {
       m[1] = {'**' : 'b>', '__': 'u>', '--': 'del>', '~~': 'i>'}[m[1]];
       return m[3] ? '<a href="' + m[3] + '">Link</a>'
                   : ('<' + m[1] + m[2] + '</' + m[1]);
     });
   }

请注意，您不能嵌套这些，即如果您说 __--abc--__ 将被转换为 --abc--。

【讨论】：