JavaScript如何用正则将字符串中的<p><br/></p>替换为空字符串

JavaScript中字符串为不可变类型，replace方法不会修改原字符串，只会返回替换后的新字符串，需要手动赋值接收结果，这是多次尝试未生效的核心原因之一。

• 第一种写法：正则仅匹配p标签内部为空白字符或 的场景，未覆盖内部存在<br/>标签的情况，同时未加全局修饰符g，即便规则正确也只能替换第一个匹配项。
• 第二种写法：将正则表达式包裹在双引号中作为普通字符串传入，此时replace执行的是精确字符串匹配而非正则匹配，且内部转义规则混乱，无法命中目标内容。
• 第三种写法：正则硬编码匹配<p><br></p>格式，未考虑<br>自闭合标签的斜杠是可选的，原字符串中为<br/>，格式不匹配导致替换失败。

正则方案 #

适配<br>的多种自闭合写法，全局替换对应p标签：

var str = "<p><br/></p>"
// 替换后赋值回str
str = str.replace(/<p[^>]*>(?:\s|&nbsp;|<br\s*\/?>)*<\/p>/g, "")
console.log(str) // 输出 ""

DOM解析方案（更稳妥，适配更多HTML边缘场景） #

如果运行在浏览器环境，用DOM解析的方式处理HTML避免正则匹配的各种漏洞：

var str = "<p><br/></p>"
const tempDiv = document.createElement('div')
tempDiv.innerHTML = str
tempDiv.querySelectorAll('p').forEach(p => p.remove())
const result = tempDiv.innerText.trim()
console.log(result) // 输出 ""

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