Javascript 组织用于不同目的(外观、jQuery和Selenium)的HTML类名和ID

Javascript 组织用于不同目的(外观、jQuery和Selenium)的HTML类名和ID,javascript,jquery,html,css,selenium,Javascript,Jquery,Html,Css,Selenium,有无数关于编写干净的HTML/CSS的文章 但我没有找到关于组织用于不同目的的类名和ID的建议(设计vs jQuery vs Selenium测试) 对于任何给定的类名和ID,很难判断它的用途。在2人以上的团队中,似乎也有一种趋势,即不断添加越来越多的ID和类,避免清理已经存在的ID和类,以免破坏东西 是否有模式、惯例、工具或智慧之珠会有所帮助?我会说:类(直接或组合针对HTML元素)用于样式设置,id用于行为(和硒元素),“不要重复自己/他人”思维-层叠样式,就是这样 如果每个人都遵循这一概念

有无数关于编写干净的HTML/CSS的文章

但我没有找到关于组织用于不同目的的类名和ID的建议(设计vs jQuery vs Selenium测试)

对于任何给定的类名和ID,很难判断它的用途。在2人以上的团队中,似乎也有一种趋势,即不断添加越来越多的ID和类,避免清理已经存在的ID和类,以免破坏东西

是否有模式、惯例、工具或智慧之珠会有所帮助?

我会说:类(直接或组合针对HTML元素)用于样式设置,id用于行为(和硒元素),“不要重复自己/他人”思维-层叠样式,就是这样

如果每个人都遵循这一概念——实现了保持代码干净的共同目标,但同时也可能意味着更多的问题——例如,多个事件委托(不使用“适当的”面向对象概念)和同一元素上的CSS类链可能会导致可读性更低,处理时间更长


所以-实际上很难有一个通用的规则-特别是如果人们有不同的观点和代码风格。但我仍然认为——样式类和行为id类都适用……

我没有遇到任何工具来帮助解决这种情况。但我使用了下面的惯例,并取得了一定的成功。然而,它们都不是一门精确的科学

关于身份证: 因为ID是更快的查找,所以每当我想处理HTML的特定部分时,不管我如何使用它(样式设置/jQuery/测试/等等),我都倾向于使用它们

但是,由于每个元素只能有一个ID,因此实际上没有机会为不同的用途使用命名约定或样式。我发现,如果我出于一个原因想要处理一个元素,那么我很有可能出于另一个原因再次需要它

例如:如果我在一个页面上有一个按钮,并使用jQuery(按ID)来附加事件处理程序来找到它,那么很可能我也想找到该按钮来测试它的行为

因此,由于一个ID可以用于多种原因,因此它应该以一种通用的方式命名,理想情况下描述元素是什么或表示什么,而不是如何使用它。无论它是如何使用的,它都应该是有意义的

但正如你所说,对于一个给定的ID

很难说它是用来干什么的

我同意你的看法,一般来说,除非有必要,否则我不会去查。其他团队成员不能向已经有ID的元素添加其他ID,如果符合他们的目的,应该鼓励他们重用现有ID

使用这种方法,现有ID不应该被更新或删除,而应该成为HTML的永久特性。(但就像任何规则一样,如果需要,它可以被打破,而且风险是值得的)

这样,每个人都可以轻松地重用现有ID,而不会让其他人更改它们而破坏它们的代码,并且ID名称对于所有用途都有意义。这将导致没有太多的“额外”ID

关于课程: 在2人以上的团队中,似乎有一种趋势是不断增加。。。避免清理那些已经存在的东西,以免弄坏东西

我的经历和你的一样;人们倾向于添加新类,而不是重用现有类。如果开发人员认为他们已经删除了使用该类的唯一代码,那么这有时也会导致他们更愿意删除该类。这反过来又会影响到任何重用该类的人,他们认为“下次我只需添加我自己的新类,以确保安全”。这是一个恶性循环的好例子

我尝试以与IDs(如上所述)相同的方式处理类,并且:

  • 使用非特定名称
  • 如果已经存在一个名称“合理”的类,则重用该类
  • 不鼓励更改或删除现有类(以增加重用的信心)
另外,对于仅出于“外部”原因(如测试)而添加的类,可以通过使用公共前缀(如“tst”)来实现例外。如果使用:

,我会考虑这种方法。
  • 将创建大量类(噪波)
  • 预计会有很大的变化(随着用法的逐渐成熟)
  • 预计未来可能会被一种不同的方法所取代
  • 由开发团队的外部团队控制
但是,使用任何一种命名约定都只能和遵循(或不遵循)它的人一样好。当没有编译器告诉您有一个错误的引用时,测试实际上是知道是否有东西被破坏的唯一方法

太长,读不下去了
所以,一般来说,我不会试图根据ID和类的使用方式来组织ID和类,而是尝试最大限度地重用它们,并尽量减少它们的更改。但如果对这个问题给出更令人信服的答案,我会持开放态度

这个问题主要是基于观点或过于宽泛。提到“暂停”:在写我的答案时,我提到了帮助中心部分链接的博客帖子。这个问题听起来很适合我,因为这是我在开发时积极考虑的问题(因此必须有OP),我试图回答以下建设性主观Qs的六点,但如果我错了,请告诉我原因,以便我可以学习。:)非常感谢。虽然没有提供灵丹妙药,但我无法想象对问题的性质以及如何尽可能最好地处理它有一个更好的总结。