直接用.class1.class2.class3（无空格）可精准匹配同时拥有这三个类的元素，因CSS交集选择器要求同一元素具备所有指定类名，与HTML中class属性空格分隔的顺序无关；带空格的.a .b是后代选择器，逗号用于并集而非多类匹配。
直接用 .class1.class2.class3 这种写法，中间不加空格，就能精准匹配同时拥有这三个类的元素。空格、逗号、正则都是错的起点。
为什么 .a.b 能匹配 class="a b"
CSS 规范里，连续的点号表示“交集”——即同一个元素必须同时具备所有列出的类名。浏览器解析 class 属性时，会按空格切分出类名集合，然后检查是否全部存在。.a.b 等价于 [class~="a"][class~="b"]，不依赖顺序，也不要求类名在 HTML 中相邻。
- ✅ 匹配：
<div class="a b">、<p class="b a c"> - ❌ 不匹配：
<span class="a">（缺 b）、<div class="a-b">（是单个类名，不是 a 和 b） - ⚠️ 注意：
.a .b（带空格）是后代选择器，找的是.a内部的.b元素，和目标完全无关
querySelectorAll 传多个类名时别用逗号拼错
如果你要选一组「各自拥有不同组合类名」的元素，比如同时找 .btn.primary 和 .btn.danger，才用逗号分隔；但逗号是分隔**多个独立选择器**，不是分隔类名。
- ✅ 正确（选两类按钮）：
document.querySelectorAll(".btn.primary, .btn.danger") - ❌ 错误（以为是“btn 且 primary 且 danger”）：
document.querySelectorAll(".btn", ".primary", ".danger")—— 只接受一个字符串参数，后两个被忽略 - ❌ 更错（空格写法）：
document.querySelectorAll(".btn .primary .danger")—— 这是在找三层嵌套的后代元素
Puppeteer / Selenium / goquery 里写错空格就找不到元素
这些工具底层都走标准 CSS 选择器引擎，对空格极其敏感。写成 .x.y.z 是找一个元素；写成 .x .y .z 是找三层嵌套结构，实际页面几乎不存在这种路径。
立即学习“前端免费学习笔记（深入）”；
- Selenium 示例：
driver.find_element(By.CSS_SELECTOR, ".css-v84xw-NakedButton.eml2css7")—— 无空格才对 - goquery 示例：
doc.Find(".text.title").Each(...)—— 动态拼接可用"." + strings.Join(classes, ".") - 常见翻车点：从开发者工具复制出来的选择器带空格，直接粘贴就失效；或把 class 属性值当字符串去正则匹配，既慢又不准（比如
class="textual"会被.text错杀）
真正容易被忽略的，是把 class 当作字符串处理——它本质是一个空格分隔的集合，不是子串。只要记住「多类 = 连写点号，无空格」，90% 的定位失败问题就消失了。
