用于匹配任何和所有 HTML 数据-* 属性的通用 CSS 选择器 [重复]答案

【问题标题】：Universal CSS selector to match any and all HTML data-* attributes [duplicate]用于匹配任何和所有 HTML 数据-* 属性的通用 CSS 选择器 [重复]
【发布时间】：2016-08-20 20:04:56
【问题描述】：

是否可以使用仅 CSS 匹配所有具有data-* 属性的节点？

以下是我想匹配的属性示例：

data-scope
data-sessionlink
data-visibility-tracking

我可以的

*[data-scope] *[data-sessionlink] *[data-visibility-tracking]

但我正在寻找更紧凑的东西。此外，我不知道在我的应用程序中可能遇到的所有可能的data-* 属性。

【问题讨论】：

这些是属性还是属性值（例如Class="data-scope"）
这些是属性。
当。有一个通配符搜索以字符串开头的属性值，但据我所知，不是属性。
是的，我对通配符属性值选择器很熟悉，我不抱太大希望我想做的事情是可能的，但直到你问别人你才知道。跨度>
如果不使用 javascript，我不确定这是否可行

标签： css css-selectors custom-data-attribute

【解决方案1】：

目前不可能使用通配符掩码按属性名称部分选择元素。

在 www-style@w3.org 邮件列表中有一个最近的thread，来自 Opera 的 Simon Pieters 提出了一个很好的可能的syntax，并在线程中得到了一些接受，所以有机会它会在未来的某个时候成为标准：

x-admin-* { ... }
[data-my-*] { ... }

【讨论】：

谢谢，马拉！我希望有一天我们能够对属性名称进行通配符选择。
虽然不是最好的主意 - 不允许您执行 [data-my-*='exact match'] 因为 *= 与现有运算符冲突
@gotofritz 好点。但这可能可以通过将属性名称本身括在引号中来解决：["data-my-*" = "exact match"]