2009-07-30 110 views
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"等etc向HTML元素添加大量CSS类

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

回答

2

这看起来是使用类将任意元数据嵌入到元素中,这当然不是类属性的设计目的。考虑到它的效果开始和结束时使用的是grepmonkey脚本,因此本地化为客户端,似乎是一种无害的破解,但我不建议在服务器端进行复制。

不幸的是,HTML在元数据方面没有提供太多的元数据,而是在无效属性中插入元数据,所以有一种机制在现有标记中为“类”属性添加语义含义 - 即microformats。围绕微格式有很多令人喘不过气来的热门话题,但总的来说,他们确实围绕着所有xml不可行的地方的最佳做法。

2

就语义而言,是的有缺点。如果您的课程没有描述实际内容,并且仅仅是出于造型目的,那么在您决定重新设计和/或重组时,这可能会伤害到您。

例如,BAD:

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

GOOD:

<div class="header main current-event"> 
+0

+1。如果你有太特定的类(即,可能相关的posted_in_2006,但可能完全不相关),那么过度使用它也可能不好。 – You 2009-07-30 21:21:18

+0

是的,过分具体的类是我所担心的。我不希望被请求轰炸“你能为这些元素添加这样和那样的类”吗?但是,只要处理/渲染/带宽问题不会阻止整个事情 – kenwarner 2009-07-30 21:26:43

+0

我不是说过分,并将元数据放在类中......当然,如果你想和他们是相关的元素是什么(类可以做的不仅仅是风格,obv他们可以用于jscript/jquery /等),但如果你只依赖他们的样式,我宁愿让他们两个类,三绝对MOST – Jason 2009-07-30 21:28:58

1

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

2

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

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

你使用jquery来查询你真正想修改的元素吗?可能会发现,使用jQuery选择器更容易选择这些元素,这些选择器对于标准JavaScript来说似乎很难或不可能,因此您可以避免所有这些额外的不必要的类。底线,如果需要的话,使用大量的类没有问题,这对生产来说是完美的,但如果你不需要它们,就像你的情况一样,必须有更好的解决方案,你可能会想出。

2

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

下面是一个例子:

class="goog-imageless-button goog-inline-block goog-imageless-button-collapse-left goog-imageless-button-collapse-right"