通过CSS类或直接(通过DOM)修改HTML元素显示的更好实践?

时间:2015-02-03 14:29:45

标签: javascript html css dom

我在标记方面有一定的经验造型,但我是前端脚本的相对新手。

有人可以澄清哪种做法更好(或最好):

直接通过DOM修改HTML元素显示/行为或通过分配和删除CSS类来实现这一点是否更好?

我自己认为使用javascript来追加或删除CSS类可能是改变元素显示和/或行为的更优雅方式,但我希望在继续之前确认这一点。

有人可以进一步评论吗?

1 个答案:

答案 0 :(得分:3)

这是一个非常一般的指导原则:

如果实际上意味着某些东西,则使用类来定义某些样式(甚至只是一种样式)。例如,如果您希望JavaScript将元素指定为选定项,请使用.selected-item类并在元素上设置该类。这使您可以在CSS文件中进行设计工作。

但是,如果您正在进行一次性修改,尤其是那些涉及计算的修改,例如设置元素相对于另一个元素的高度......那么您应该使用这些特定属性修改element.style对象。

总结:如果有意义,请使用课程。如果属性是一次性的话,直接修改属性。

实际上,这也适用于基本HTML。您可以轻松定义类.center {text-align:center}并将其应用于居中对齐的元素,因为它不是一次性交易。但是如果你需要一个特定元素有一些额外的底部边距,使用style="margin-bottom:20px"而不是为此定义一个类。