列表的 JavaScript RegExp 问题答案

【问题标题】：JavaScript RegExp issue with lists列表的 JavaScript RegExp 问题
【发布时间】：2021-04-05 07:35:13
【问题描述】：

人！我有一个问题，我不知道如何用 ul、li 标签替换我的文本。

这里是：我有这样的文字，例如：

let text = "Du bist der beste Mensch";

我需要将“der beste Mensch”部分转换为：

<ul>
 <li>der<li>
 <li>beste<li>
 <li>Mensch<li>
</ul>

所以一般的输出应该是：

杜比斯特

德
最好的
男人

我尝试使用正则表达式并最终得到：

text.replace(/(?:^|\n)- (\S+)/g, '<li>$1</li>');

如果我输入<ul><li>$1</li></ul>，它当然会给我在 ul 和 li 标签中的那些词，这不是我想要的。

【问题讨论】：

我认为这与 RegExp 无关。
我可以给你一个没有正则表达式的方法吗？
Teemu，我只是想制作我自己的文本编辑器，你知道，将文本包装成 ** ** 以使其粗体或 ... 使斜体。正则表达式对我帮助很大。所以我想他们可能也可以帮助我列出清单......
armin yahya，是的，请
嗯，RegExps 可以做很多事情，但这似乎超出了他们的范围。您能否澄清一下，您是要创建实时标记，还是要将列表作为文本显示在文本编辑器中？此外，您如何确定实际从哪里开始列表？在示例中它从“der”开始，但如果这是用于文本编辑器，则文本几乎可以包含任何内容。

标签： javascript html regex frontend html-lists

【解决方案1】：

假设这是原文的格式：

Du bist 
- der
- beste
- Mensch

您可以将replace 嵌套为 2 个步骤：

替换<ul>标签内的整个列表
替换<li>标签内的每个列表项

const text = `Du bist 
- der
- beste
- Mensch
`;

const result = text.replace(/(?:(?:^|\n+)- [^\n]+)+/g, 
  list => `<ul>${list.replace(/(?:^|\n+)- ([^\n]+)/g, '<li>$1</li>')}</ul>`
);

console.log(result);

【讨论】：

我觉得需要多学习JS中的正则表达式。非常感谢！