没有对应的CSS规则使用CLASS属性是否是不好的形式？

Question

例如，如果我想使用jQuery选择具有特定类的一些元素，并且仅出于这个原因，那么是否总是期望这些类在CSS中定义？

<div class="xyz">
something
</div>

<div class="xyz">
something else
</div>

//with example jQuery
$(".xyz").hide();

//is it wrong no element 'xyz' is defined in css?

- CRice

---

使用该方法是可以的，但如果您负责提供唯一标识符，请始终使用ID。 - jAndy

这不算失礼，但有点不绅士。 - Dan Diplo

@SecondRikudo 这怎么可能是一个重复问题，如果它比另一个问题早三年就被提出了呢？ - CRice

@CRice 因为另一个问题有更好的答案。 - Madara's Ghost

应该有一个选项“关闭，因为其他地方有更好的答案” - CRice

Answer 1

这是完全可以接受的。随着客户端处理变得越来越普遍（通过jQuery、ExtJS、Prototype等），创建能够使用这些库提供的强大选择器支持的高效代码是有意义的。

- Mike Trpcic

Answer 2

使用CSS类和 - 根据情况 - ID（唯一的！）是完全可以的，而且通常是在保持HTML代码有效的同时提供脚本使用的附加属性的唯一解决方案。

虽然使用非标准属性也往往有效，但它会阻止您的HTML代码验证，并可能在未来引起问题。

然而，对于某些情况，还可以使用属性 - 比如链接上经常用于修改链接行为的rel。

此外，http://www.w3.org/TR/html401/struct/global.html#h-7.5.2 还提到class是通用的：

“另一方面，class属性将一个或多个类名分配给元素；该元素可以说属于这些类。一个类名可以由多个元素实例共享。class属性在HTML中具有多种作用：”

• 作为样式表选择器（当作者希望将样式信息分配给一组元素时）。
• 供用户代理进行通用处理。

- ThiefMaster

Answer 3

我不这么认为。

如果使用类似“right”、“pink”等的类别，您就没有将数据与表现分开。

我使用类别来定义元素中的内容。

<div class="product">

我可以使用CSS和JS，但有时候我更喜欢使用类名来方便调试。

- Benbob

Answer 4

属性指定元素的类名。

属性大多用于指向样式表中的类。然而，它也可以被JavaScript（通过HTML DOM）用来更改具有指定类的HTML元素。

来源

在没有对应CSS规则的情况下使用属性并不是不好的形式...

将用作“数据容器”甚至比使用其他属性（如rel、title等）更好...

- Reigel Gallarde

Answer 5

其实这很狡猾。一开始你可能没有想到，但是你可以通过类层次结构做一些非常聪明的事情。

例如，Facebook使用User-Agent HTTP标头在body标记上设置特定于浏览器的类。虽然它不是一直使用，但它可以用于编写特定于浏览器的CSS，并且它比许多其他替代方案更优越，因为它只是CSS的巧妙用法，使您将浏览器特定的内容与一般CSS规则分组在一起，促进CSS文件中的局部性。当您需要长时间维护CSS文件时，这一点非常重要。

a { color: blue; }
.ie7 a { color: black; }

因为CSS的“级联”，当在Internet Explorer 7中呈现时，上述锚点标签的CSS规则将更加具体。通过选择器的特异性，这将强制IE7中的锚点标签为黑色，而无需使用hackish和晦涩的CSS技巧。

正如其他人所提到的，它也可以通过JavaScript使用。我发现将CSS类用作布尔标志非常有用。例如，我可以使用它来创建一个非常简单的水印控件。

<input type="text" value="watermark" class="watermark" />

$('input').focus(function(e) { 
    var target = $(this);
    if (target.hasClass('watermark')) {
        target.val('');
        target.removeClass('watermark');
    }
});

那个 jQuery 代码片段可以很好地工作，但更微妙的是，我现在有两个东西。逻辑和样式一次搞定。因为水印在这里被用作标志，所以还可以根据此输入的状态通过 CSS 应用特定的视觉样式，例如，当水印处于活动状态时，我可能想要一个灰色斜体字体。类似这样的例子还有很多，我鼓励你进行更多实验。

- John Leidegren

Answer 6

我认为这是可以的。该属性被命名为class而不是cssstyleclass或其他类似的名称。使用class属性定义具有共同特征的元素是非常合理的。

- Jarrett Widman

Answer 7

我不认为这是一个不好的做法。如果你需要它们，你应该使用它们。这让语气上更合理。

如果你不想用它们，也许你有一个包围所有元素的父元素，或者你可以找到其他它们共同拥有的东西，并将其转化成选择器。$("div#somediv > div").hide()但是这会花费你更多时间和思考，而如果你只是给它们一个类，那就简单多了。

- meo