使用正则表达式将特定类名p标签转换为ul-li结构的问题

尝试用正则表达式把带有MsoListParagraphCxSpFirst/Middle/Last类名的<p>标签，转换成<ul>包裹的<li>项，但现有代码未生效，相关代码和标记如下：

现有代码 #

html = html.replace(/<p class="MsoListParagraphCxSpFirst">(.*?)</p>/, '<ul><li>$1</li>');
html = html.replace(/<p class="MsoListParagraphCxSpMiddle">(.*?)</p>/, '<li>$1</li>');
html = html.replace(/<p class="MsoListParagraphCxSpLast">(.*?)</p>/, '<li>$1</li><ul>');

当前标记 #

<p class="MsoListParagraphCxSpFirst">Item 1</p>
<p class="MsoListParagraphCxSpMiddle">Item 2</p>
<p class="MsoListParagraphCxSpLast">Item 3</p>

期望标记 #

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

问题原因与修正方案 #

核心问题 #

1. 未全局匹配：JavaScript的replace方法默认只替换第一个匹配项，未加g标志导致后面的<p>标签不会被处理
2. 标签错误：最后一个替换中把闭合的</ul>写成了<ul>，导致结构错误
3. 格式缺失：未处理换行和缩进，输出结果会挤在一起

修正后的代码 #

// 全局匹配所有目标标签，添加g标志；修正最后一个替换的闭合标签，同时加入格式换行
html = html.replace(/<p class="MsoListParagraphCxSpFirst">(.*?)<\/p>/g, '<ul>\n    <li>$1</li>');
html = html.replace(/<p class="MsoListParagraphCxSpMiddle">(.*?)<\/p>/g, '\n    <li>$1</li>');
html = html.replace(/<p class="MsoListParagraphCxSpLast">(.*?)<\/p>/g, '\n    <li>$1</li>\n</ul>');

说明 #

• 每个正则末尾添加g（全局匹配）标志，确保替换所有符合条件的标签
• 修正最后一个替换的闭合标签为</ul>，保证HTML结构合法
• 在替换字符串中加入\n（换行）和空格，让输出的HTML结构和期望格式一致
• 确保正则完整匹配闭合的</p>标签，避免匹配不完整

测试结果 #

运行修正后的代码后，当前标记会被转换为符合期望的格式：

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

内容的提问来源于stack exchange，提问作者Erasersharp