CSS 选择器测试器
粘贴 HTML 和 CSS 选择器,即可立即查看该选择器匹配的所有元素,包括数量和每个匹配元素的标记。使用浏览器自身的选择器引擎,因此结果与 document.querySelectorAll 完全一致——非常适合调试爬虫、样式表和测试选择器。无效选择器会被标记。全部在浏览器本地运行——不会上传任何内容。
—
使用方法
- 在第一个框中粘贴你的 HTML。
- 输入 CSS 选择器(例如 li.item 或 a[href^="https"])。
- 查看匹配数量和每个匹配元素;需要时可复制。
常见问题
- 支持哪些选择器?
- 浏览器通过 querySelectorAll 支持的任何选择器,包括组合器、属性选择器、:not()、:nth-child() 等。像 ::before 这样的伪元素与 DOM 中一样不匹配任何内容。
- 结果准确吗?
- 准确。HTML 会被解析为真实文档,并用浏览器原生选择器引擎查询,因此匹配结果与 querySelectorAll 在该标记上的返回完全一致。
- 如果选择器无效会怎样?
- 选择器输入框会高亮并显示错误消息,而不是返回有误导性的结果。
- 我的 HTML 会被发送到某处吗?
- 不会。解析和匹配完全在你的浏览器中进行,不会上传任何内容。
相关工具
CSS 优先级计算器
粘贴任何 CSS 选择器，查看其 (ID, 类, 类型) 优先级、每个 token 拆解，及与另一选择器的对比。
开发 0 0
HTML / CSS / JS 压缩器
去除 HTML、CSS、JavaScript 的空白与注释——查看体积减少并复制结果。
开发 0 0
颜色名称查找
为任意 hex/RGB 颜色查找最接近的 CSS、Tailwind 或 XKCD 调查色名 — 按 OKLab 空间感知距离排序。
颜色 0 0
正则表达式测试器
实时测试 JavaScript 正则，匹配高亮并预览替换结果。
开发 0 0
Glob 模式测试器
在浏览器中针对 glob 模式(*、**、?、[...]、{a,b})测试文件路径。
开发 0 0
CSS 命名颜色
全部 147 个 CSS / X11 命名颜色，含 HEX、RGB 与实时色块 — 可搜索、按色相分组。
颜色 0 0