4

我有一个留言板,我的一个用户编写了一个greasemonkey 脚本来对页面中的各种元素进行样式化。他在这方面做得很好,但为了让他的工作更轻松,他的脚本中的第一步是解析当前页面并为页面上的几乎所有 html 元素添加几个 css 类。它们中的大多数根本不用于设置页面样式,而是让他更容易查询他将实际修改的每个页面的几个元素。例如class="thread_started_by_user_123 thread_with_456_posts thread_with_789_views thread_last_posted_in_by_user_12345"

这是标准做法吗?添加大量不必要的 css 类是否有任何缺点,无论是在 javascript 中,还是在服务器上,如果我也将它们添加到服务页面。

4

5 回答 5

2

在语义方面,是的,有缺点。如果您的类不能描述元素实际是什么并且仅用于样式目的,那么如果您决定重新设计和/或重组,这可能会伤害您。

例如,坏:

<div class="header red left-side">

好的:

<div class="header main current-event">
于 2009-07-30T21:11:53.640 回答
2

如果没有与分配给元素的类关联的样式,那么我相信浏览器会忽略它。因此,如果您担心的话,它不会大大增加您的页面处理时间。

但是,如果每个元素都有大量的类,那么您必须意识到您正在使用宝贵的带宽并增加以这种方式加载整个页面所需的时间。您可以通过外部化 CSS 来避免该问题,以便浏览器可以缓存它。

您是否使用 jquery 来查询您真正想要修改的元素?事实证明,使用 jquery 选择器选择那些在标准 JavaScript 中似乎很难或不可能的元素更容易,因此您可以避免所有这些额外的不必要的类。

最重要的是,如果需要,使用大量类是没有问题的,这对于生产来说非常好,但如果你不需要它们,就像你的情况一样,必须有一个更好的解决方案,你可能会来跟上。

于 2009-07-30T21:22:15.773 回答
2

这看起来是使用类将任意元数据嵌入到元素中,这当然不是类属性的设计目的。鉴于它的效果以greasemonkey 脚本开始和结束,因此本地化到客户端,这似乎是一种无害的黑客攻击,但我不建议在服务器端复制。

不幸的是,当涉及到元数据时,除了插入无效属性之外,HTML 并没有提供太多替代方式,因此有一种机制可以为现有标签中的“类”属性添加语义含义 - 即microformats。围绕微格式有很多令人窒息的流行语炒作,但总体而言,它们确实围绕着一个最佳实践,适用于不可能使用全 xml 的领域。

于 2009-07-30T21:26:49.320 回答
2

只是为了一个数据点,我昨天看了一下 GMail 的 HTML(他们的按钮非常漂亮),它充满了那种东西。

这是一个例子:

class="goog-imageless-button goog-inline-block goog-imageless-button-collapse-left goog-imageless-button-collapse-right"
于 2009-07-30T22:35:15.470 回答
1

类不仅用于 CSS,它们还用于标记部分的分类。基于该分类应用样式只是一种用途。因此,如果这些类对其他分类目的有用,那么这很好,而且是非常好的实践。

于 2009-07-30T21:12:17.027 回答