如何用正则匹配id或class含特定词的HTML标签并完成删除操作？

最优方案：直接使用属性包含选择器 #

你不需要自己写正则提取属性值，jQuery和原生CSS都支持*=属性包含匹配语法，可以直接命中id或class属性中任意位置带指定关键词的元素，完全不用处理类名空格的问题：

// 仅匹配div标签，id或class含chat就删除
$('div[id*="chat"], div[class*="chat"]').remove();

// 如果要匹配所有标签，把div换成*即可
// $('*[id*="chat"], *[class*="chat"]').remove();

语法说明：[attribute*="value"] 表示只要属性值中包含value字符串就匹配，不管位置在哪，多个类名的场景也能直接识别，完全符合你的需求。

自定义正则思路的修正方案 #

如果你需要精准匹配单个类名（避免属性值里其他位置碰巧带chat的极端情况），可以直接遍历元素的classList判断：

document.querySelectorAll('div').forEach(el => {
  // 先判断id是否包含chat
  if (el.id && el.id.includes('chat')) {
    el.remove();
    return;
  }
  // 遍历所有类名判断
  for (const cls of el.classList) {
    if (cls.includes('chat')) {
      el.remove();
      return;
    }
  }
})

这个写法会逐个校验每个类名，不会受多类名之间的空格影响，比你自己提取class属性值再替换空格的逻辑更稳定。

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