许多人喜欢使用ID不同的原因.
我在Stackoverflow上看到过有关ID与类的许多问题,但是没有人提到纯代码组织的观点,而不考虑兼容性和运行时性能.
从代码组织的角度来看,我认为使用ID是坏的,就像在Visual Basic代码中使用全局变量一样.
一个原因是ID必须是唯一的,这会在代码的不同独立部分(控制HTML DOM树的不同部分)之间引入不必要和不良的依赖.
另一个原因是,创建新的类名实际上比ID名称更容易,因为使用ID,您必须担心全局范围和类名,您只需要担心本地范围的唯一性,与局部变量相同的好处.
大多数人会认为,通过身份证明来处理表现要比上课好,我会同意这一点.但是随着浏览器变得越来越高级,本地实现的CSS地址从javascript和计算机变得更快,性能变得越来越不重要.所以让我们忽略它,只集中在当前问题背景下的代码组织.
这个讨论从here开始,但是我的潜在错误的建议会产生负面的影响,变得太大了,不能保持评论,所以在这里我试图把它转化为积极和可管理的东西.
有利于ID的一个可见点是将它们用作规则优先级的工具,因为#name的优先级高于.name的优先级.
我的回答:使用ID来提高优先级是坏的,它更干净,如果您使用插入在主体和其他级别的树之间的额外的根元素,那么会有更多的自由,例如body div div priority.class1 {}的优先级高于body div span.class1 {}高于body span.class1 {}高于span.class1 {}.另一个用于此目的的工具是重要的.
有些人可能会认为,使用更多的根元素意味着更多的困难,当页面结构发生变化,但我不认为是这样的情况,因为你不必在身体和指定优先级div之间任何东西.这些div可以永远保持在身体以下,而不是其他内容.
指针之间带来了另一个有趣的关联,而且ID也不错,因为指针不错.
我的回答:如果你在代码中硬编码绝对内存地址,那么指针是坏的.使用相对指针总是更好(例如:在8086 cpu中使用段(CS,DS,SS,ES);由编译器生成的相对变量和方法地址).如果我们将DOM树视为内存,并使用ID比较使用类,则#name表示绝对内存地址,但div.tab1 .name表示相对地址(相对于div.tab1).
我看到的ID的另一个支持点是具有ID的元素在javascript中更容易被用作成为全局属性.我的回答:再次,这就像说Visual Basic中的全局变量更方便可用.问题在于,您不能按顺序保持足够大的全局(或任何其他)命名空间,而不会引入像level1_level2_name这样的命名层次结构,这仅仅是将另一个命名空间机制替换为一个命名空间机制. DOM树足够方便组织名称空间,为什么忽略它?
使用下划线的ID中的命名空间模拟是坏的,因为您无法建立命名上下文,并且必须重复代码中的所有路径.这实际上意味着您将无法使用修复CSS无法使用上下文的CSS preprocessors.
解决方法
当您正在寻找页面上真正独特的元素时,ID仍然具有自己的位置,特别是在处理将要在JavaScript中更改的元素(例如,隐藏的叠加层)时.