如何用正则表达式按ID移除整个HTML标签及其内容？

你的代码有几个关键错误导致替换失败，一一拆解：

• 未使用正则表达式语法：replace的第一个参数如果是字符串，只会做字面匹配，不会解析.*?这类正则元字符。必须用/正则规则/的正则字面量（或new RegExp构造函数）才能启用正则匹配逻辑。
• 正则未开启dotAll模式：默认情况下，正则的.不会匹配换行符，而你的HTML内容包含换行，导致.*?无法跨行匹配testArea内部的内容。需要添加s标志让.匹配包括换行在内的所有字符。
• 硬写标签属性限制了匹配范围：你把style="display:block"固定进正则，万一标签属性顺序变化（比如style在id前面）、新增其他属性，就会匹配失败。应该只聚焦id="testArea"这个核心标识，忽略其他属性。

修正后的代码如下：

let test = `
<div class="wrap">
    <div id="testArea" style="display:block">
        <div>
            <table>...blah</table>
        </div>
    </div>
</div>
`

// 匹配包含id="testArea"的div标签及其内部所有内容
let testReplace = test.replace(/<div[^>]*id="testArea"[^>]*>.*?<\/div>/s, '');
console.log(testReplace);

正则规则说明： #

• <div[^>]*：匹配<div开头，后面跟任意非>的字符（即div的所有属性内容）
• id="testArea"：精准匹配目标id标识
• [^>]*>：匹配剩余的属性和标签闭合的>
• .*?：非贪婪匹配标签内部的所有内容（避免误匹配到外层的div）
• <\/div>：匹配闭合的div标签
• s：dotAll标志，让.可以匹配换行符

另外注意你原HTML里的<tale>是笔误，应该改成<table>，不过这不会影响替换逻辑。

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