Javascript 出于CSS目的使用id属性的原因是什么？

我总是使用

class

属性，而从不使用

id

来选择CSS和设置样式。我知道

id

必须是唯一的，但这似乎不是CSS使用它的理由

我使用

id

属性的唯一原因是用于JavaScript和表单标签

我发现将

id

和

class

混用在CSS中可能会造成混乱，对我来说，这是一种很好的方式来强制分离风格和行为

是否有充分的理由将

id

用于CSS目的？使用

id

可以实现哪些功能，而使用

class

无法实现哪些功能

我发现有用/有趣的评论

• 你可以对班级说同样的话。有很多JavaScript确实（而且必须）以特定类的元素为目标。从行为的角度来看，在这些实例中更改类也是有问题的。-阿伦西布
• ID在级联中的特异性不同于类。-基尔罗伊
• 如果ID是一个没有重复项的元素，那么使用ID进行样式设置是有意义的，特别是如果它是在所有/大多数页面中显示的内容-RichN

---

如果您有同一类的多个元素，并且需要为其中一个或多个元素指定不同的样式，那么我认为这是非常有效的

否，但如果元素具有

id

为什么不将其用于样式设置

---

对于元素名称，您可以说同样的话-对于

p

您做不到的事情都是

class='paration'

做不到的。这并不意味着在每个

元素中添加
class='paration'
是个好主意。
在我看来，使用基于ID的样式是个坏主意

ID是唯一的，在DOM中最多只能出现1次。这将任何ID相关样式的使用限制为最多1次

另一方面，CSS类可以多次使用，也可以完全不使用

坦白地说，我认为ID应该用于行为，类应该用于风格。事实上，您可以互换使用它们，这是导致web开发的某些方面不一致的一部分。
选择任何具有唯一id的对象都比选择类快。这种差异可以忽略不计，但在具有大量DOM元素的应用程序或密集的Javascript应用程序中，它会产生差异

例如，如果您正在使用jQuery，请检查以下内容：
如果它是一个没有重复项的元素，特别是如果它是显示在所有/大多数页面中的元素，则使用ID进行样式设置是有意义的

例如：


页眉和页脚
搜索框（你可以在上面看到的东西）
导航列表（类似于右侧的内容）
您不必使用ID。没有一种设计可以使用无法使用类创建的ID创建

尽管如此，使用ID的优点是可以清楚地将选择器标记为只应用于页面中的一个元素。我通常使用它们为页面模板中的元素（内容、导航等）设置样式

一般来说，我会尝试在允许我使标记更简洁的领域使用它。当选择器可以针对某个标记时，您应该使用该标记。当它可以针对一个ID时，请使用该ID。否则，请使用类

但是，再说一遍，您是否使用id并不十分重要。
当我知道我将在特定元素上使用javascript时，我会使用id。ID比javascript中的类快得多。
我倾向于认为HTML中
ID
和
class
的关系类似于面向对象编程：
ID
就像
类的一个实例

我使用类多于使用ID，并且经常使用多类选择器（例如
.film.trail
）。但是，如果我确实想识别一个特定的元素，以便应用特定的样式或行为，那么我将分配一个
id
，通常还会分配一个
类。例如

<ul>
    <li class="film drama">A</li>
    <li class="book drama">B</li>
    <li class="film documentary" id="film-9832">C</li>
</ul>


A
B
C


在分配id时，我认为“页面上有不止一个这样的id是否有意义？”。如果答案是肯定的，那么我可能会去上课

因此，正如@RichN和@AaronSieb所提到的，我经常使用id来表示特定的页面元素，这些元素肯定只在页面上出现一次：

<ul class="sidebar" id="site-meta">[...]</ul>

[…]
ID识别、分类。这一点在这里已经提到好几次了，或多或少

例如：

<div class="author" id="stephen">[...]</div>

比

body>p.news.recent {}

当用户代理找到这两个元素时，第一个将占上风。
我唯一能想到的使用ID的方法是，如果你有一个特殊性战争-两个具有相同特殊性的元素。应用ID将使元素具有更高的特异性，准确地说是+100

因此，如果定义了两种具有相同特异性的样式，您可能希望通过对另一种样式应用更高的特异性来“重击”其中一种样式。这就是说，您也可以通过对选择器应用更具体的类来实现同样的效果，这将使特定性增加10

ID=100（#foo）
等级=10（.bar）
element=1（div）
我使用ID标签的主要原因是与阅读我的代码的人交流。具体地说，ID标记可以轻松地引用他们想要引用的任何特定元素，并且完全放心，因为他们知道对它所做的任何更改都只会影响该元素

编辑：使用您可能不知道的ID标签还有一个更为技术性的原因。我再次更新了这篇文章，根据的和一些出于历史目的的进一步研究。此信息
body>p.news.recent {}

#header
{
...
...
...
}

#footer
{
...
...
...
}