将 Whatsapp 降价转换为 HTML 标签答案

【问题标题】：Convert Whatsapp markdown to HTML tags将 Whatsapp 降价转换为 HTML 标签
【发布时间】：2021-12-02 21:51:27
【问题描述】：

我需要将 Whatsapp markdown 转换为 HTML 标签。

例如。

*Bold* to <b>Bold</b>
_Italic_ to <i>Italic</i>

我想使用正则表达式来捕获字符串中的单词。

这是链接，包含测试用例，以及我最好的尝试。 https://regexr.com/4gnqr

正则表达式应该同时捕获*bold* 和*some more bold text*。

【问题讨论】：

检查右上角的global标志。
我不知道 Whatsapp 和 Github 中使用的降价有什么区别？要将 markdown 解析为 html，您可以使用库来避免极端情况。 ShowDown 是已知的。
@Thefourthbird 谢谢，想试试，但无法在输入框中输入。没有注意到右上角的标志部分。
@iepur1lla 谢谢，但不想为这么小的用例下载库。
你能显示你使用的正则表达式和使用的目标吗？ _*sadf*_ 呢？

标签： javascript regex

【解决方案1】：

你可以简单地使用这两个表达式，

(\*)([^*]+?)(\*)

(_)([^_]+?)(_)

并将其替换为：

<b>$2</b>

<i>$2</i>

这可能会解决问题。

Demo 1

Demo 2

示例

const regex = /(_)([^_]+?)(_)/gs;
const str = `*Bold* to <b>Bold</b>
_Italic_ to <i>Italic</i>
This is a *bold* text, along with *some more bold text*. We also have some _italic_ text.`;
const subst = `<i>$2</i>`;
const result = str.replace(regex, subst);

console.log(result);

【讨论】：

您不应该对已知值使用反向引用。此外，捕获已知值是无用的。此外，将正则表达式区分为不同的和独立的。

【解决方案2】：

你可以使用一个简单的正则表达式：

const regex = /\*(.*?)\*/g;
const test = "*bold*, not bold, *bold again*";
//            ^1   ^2           ^3         ^4
const result = test.replace(regex , '<strong>$1</strong>')
console.log(result)

您希望从 * 到下一个 * 并保存其间的所有内容：*(.*?)*
（没有?，它将从第一个到最后一个^{（例如1->4而不是1->2、3->4）}，它被称为（非）贪婪）。
这不起作用，因为* 是一个正则表达式字符，所以你必须转义 -> \*。
/g 表示“全局”，例如替换所有出现（而不是仅第一次出现）。
$1 持有我们的第一个（仅在本例中）值。

下划线版本的作用相同，不需要像* 那样转义。

【讨论】：

【解决方案3】：

选择适合您需求的完美正则表达式。如果您不希望样式跨越新行并且使用([^*<\n]+) 确保样式之间至少有一个字符，否则** 之间没有字符将变得不可见。

function format_text(text){
return text.replace(/(?:\*)([^*<\n]+)(?:\*)/g, "<strong>$1</strong>")
     .replace(/(?:_)([^_<\n]+)(?:_)/g, "<i>$1</i>")
      .replace(/(?:~)([^~<\n]+)(?:~)/g, "<s>$1</s>")
      .replace(/(?:```)([^```<\n]+)(?:```)/g, "<tt>$1</tt>")
}

•上述代码的缺点是，您不能嵌套样式，即 *_Bold and italic_*

要允许嵌套样式使用这个?

format_text(text){
return text.replace(/(?:\*)(?:(?!\s))((?:(?!\*|\n).)+)(?:\*)/g,'<b>$1</b>')
   .replace(/(?:_)(?:(?!\s))((?:(?!\n|_).)+)(?:_)/g,'<i>$1</i>')
   .replace(/(?:~)(?:(?!\s))((?:(?!\n|~).)+)(?:~)/g,'<s>$1</s>')
   .replace(/(?:--)(?:(?!\s))((?:(?!\n|--).)+)(?:--)/g,'<u>$1</u>')
   .replace(/(?:```)(?:(?!\s))((?:(?!\n|```).)+)(?:```)/g,'<tt>$1</tt>');

// extra:
// --For underlined text--
// ```Monospace font```
}

? 如果您希望您的样式跨越新行，请从正则表达式中删除 \n。此外，如果您的新行是 html 中断标记，您可以将 \n 替换为 <br>

【讨论】：