Question

我有一个相当边缘的问题。我想知道使用id或class属性是否会产生相同的结果是否更好。我不是在询问id和class之间的区别。

我知道答案。如果我确定它是唯一的，我应该使用id吗？或者，我应该在每种情况下都使用类，除非绝对需要id吗？

基本上，我应该尽可能具体或尽可能一般吗？

场景：假设我有3个div。第一，第二和第三。使用类或ID？

Answer 1

你需要创建一个将在所有div中使用的类，这个类包含公共属性。

并且您需要为每个div创建ID并包含不同的属性。

<style>
    .box{border:1px solid red; padding:10px; margin:4px; border-radius:4px;}
    .float-left{float:left;}
    .float-right{float:right;}
    #first{background:blue;}
    #second{background:pink;}
    #third{background:green;}
</style>

<div id="first" class="box float-left"></div>
<div id="second" class="box float-left"></div>
<div id="third" class="box float-right"></div>

输出将是3个框，在我们在框中添加的所有div中都有属性。前两个盒子将向左浮动最后一个框将向右浮动

并且基于ID（s），每个人都有不同的背景

Answer 2

ID或类的使用取决于各种因素，例如元素的唯一性或DOM结构中元素的层次结构。还有一个因素被大多数开发人员普遍忽视。您的开发过程的方法。如果你专注于TDD，即测试驱动开发，最好使用ID而不是类。因为许多测试框架很容易根据ID而不是类来定位元素。此外，如果使用ID，最好定义元素的XPATH。这使您的代码易于测试。在诸如Selenium之类的平台中，它有时会迫使您使用ID，因为很难使用类来定义元素的xpath。因此对于单元测试，建议使用ID而不是类。因此，如果您希望使用Selenium或任何此类工具对代码进行单元测试或集成测试，我建议您使用ID。并且标记我的文字，代码的质量是否是可测试的。

html id vs class class best practice

2 个答案: