如何用正则表达式从压缩CSS中移除元素选择器？

要移除压缩CSS里所有非类选择器（即不以.开头的选择器，比如tr、col这类元素选择器），可以用下面的正则表达式，将匹配到的内容替换为空字符串：

(?:^|})[^.][^{]*{[^}]*}

正则说明 #

• (?:^|})：定位选择器块的起始位置——要么是字符串开头，要么是上一个选择器块的闭合}，确保只匹配独立的选择器块
• [^.]：确保当前选择器的第一个字符不是.，直接排除类选择器
• [^{]*：匹配选择器名称到{之前的所有内容（元素选择器不会包含{）
• {[^}]*}：匹配选择器后的大括号及内部所有样式内容

示例验证 #

原压缩CSS：

tr {...}.style0 {...}.style1 {...}col {...}.style2 {...}.style3 {...}

替换后结果：

.style0 {...}.style1 {...}.style2 {...}.style3 {...}

为什么你之前的正则不行？ #

你用的(?!\.).*?{.*?}存在两个核心问题：

1. 负前瞻(?!\.)只检查当前位置的下一个字符，当匹配到类选择器内部的字符时（比如.style0里的style0部分），也会满足“下一个字符不是.”的条件，导致错误匹配类选择器里的内容
2. 没有限定选择器的起始位置，会从任意位置开始匹配，无法精准定位独立的选择器块

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