javascript - JS和CSS的单独ID和类

在一些jquery教程中，单独的ID和Class用于JS和CSS。例如

<div id="test" class="test">TEST</div>

因为ID用于jQuery代码，而Class用于CSS。对我来说，不引入Class和使用ID作为CSS规则也比较容易。在javascript中使用css lessID有什么好处吗？
编辑：谢谢各位！我知道ID和Class之间的区别；我在问为什么有些人在一个足够的时候使用单独的ID和Class来表示JS和CSS。这里，问题是ID唯一性的必要性。这种情况是分离JS和CSS任务（当它们紧密地纠缠在一起时）。
EDIT2：根据要求，我给出了一个典型的例子：thisTutorial。Look foractionsBox；.actionsBox用于CSS和#actionsBox用于JS。正如你所看到的，只有一个<div>所以ID就足够了。

最佳答案

编辑：@Sharon commented a link to a great article讨论在CSS中使用id选择器的缺点。
人们可能只在CSS中使用类的一个原因是id选择器的特殊性。
如果一个元素有两个样式声明，并且它们为一个属性指定不同的值，那么使用更具体的选择器的样式声明将胜出。
例如：
HTML格式

<div id="test" class="special-test"></div>

CSS

#test {
    color: red;
}

.special-test {
    color: blue;
}

ID选择器在特定性方面胜过所有其他选择器（有关规则，请参见http://www.w3.org/TR/selectors/#specificity），因此在这里，<div>将是红色的。
将class="test"添加到<div>中的人可能会这样写：
HTML格式

<div id="test" class="test special-test"></div>

CSS

.test {
    color: red;
}

.special-test {
    color: blue;
}

当两个样式声明都有具有相同特异性的选择器时，后面的声明获胜，因此这里的<div>将是蓝色的。
就我个人而言，我从未发现这是个问题。在第一个示例中，要使<div>变成蓝色，您只需编写以下内容：

#test.special-test {
    color: blue;
}

但我想有些人觉得这方面的特殊性不必要的复杂，所以避免它只使用类选择器在他们的CSS。
（我假设他们保留id是因为在JavaScript中通过id比通过类检索DOM元素更快。）

关于javascript - JS和CSS的单独ID和类，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/9260004/