HTML元素类名中的星号

Question

回顾Zappos.com的源代码，我注意到它们有许多使用类名的html元素，如：

class='gae-click*-*Promos*Join-Zappos-Rewards-Earn-Points-Get-Free-Expedited-Shipping-and-more-Learn-More- images '

我知道星号可以用于css文件本身，用于选择器，但我对页面元素中的星号并不熟悉。

是通配符还是什么？还是仅仅是一个类的名称？

Answer 1

*符号是类属性的一个有效值，在Zappos.com网站中的使用可能与他们使用的框架有关(可能是由*拆分来绑定一些事件，比如click之类的)。

在检查CSS时，没有与带有*字符的类相关的定义。

在开发过程中，如果您需要在元素之间建立关系，使用class-with-very-long-definition-regarding-some-element可以提供帮助。这与添加data属性完全相同，如果您没有真正使用它。

一个很好的用例是通过类名中的“关键字”过滤来添加事件(例如，使用class*="click"单击/悬停)。

Answer 2

根据HTML5规则，星号是class属性的可接受值。

以下是一个完整的解释：HTML5: Permitted Values for ID & Class Attributes

Answer 3

类gae-clickGlobal-Header-zapposheaderPromos*Join-Zappos-Rewards-Earn-Points-Get-Free-Expedited-Shipping-and-more-Learn-More-图像

附加到(潜在的全局)标题中的一个图像元素，带有的alt标记(和标题)，Join Zappos奖励:赚取积分，获得免费快速运输，等等！了解更多信息。

对我来说，他们只是在使用一个过于具体的基于词汇的类。

虽然他们可能会在class^=上选择“gae”或class~=“*Promos”，但这似乎是合理的。