使用MVC和jQuery,我正在更多地使用CSS。想到的一个问题是使用Element ID与Classes的最佳方法是什么。如果我使用元素ID,jQuery中的选择器会更短。例如:
#imageTag... $('#imageTag')
#searchTag... $('#searchTag')
作为替代方案,它可以使用父容器元素进行结构化。
#searchTool, #classifyTool .tag
在这种情况下,选择器如
$('#searchTool .tag')或$('#classifyTool .tag')
可以使用。当整个页面中存在多个类的实例时,该方法尤其有用,例如.tag。您只需更改父容器对象。
这只是一个简单的理论示例,并不是为了代表真实的风格,只是描绘了这个概念。
所以有两个问题:
假设页面上有大量样式,是否对页面/ CSS或jQuery的性能有任何影响?
第二种方法似乎更灵活,更易于维护。根据您的经验思考。
有更好的替代方法吗?
由于
答案 0 :(得分:30)
至于哪一个使用,请使用最合适的。如果您的页面上有搜索框,那么使用ID就是最合适的,因为只有一个搜索框。另一方面,表行可能会被类标识,因为有(或可能)不止一个。
尽量不要像“.class”那样使用选择器(在CSS或jQuery中)。你迫使jQuery或浏览器基本上遍历整个文档树。大多数情况下,该类仅适用于一种标记,因此请指定(例如“div.class”)。仅此一点就可以产生巨大的性能差异(特别是对于带有大型文档的jQuery)。
选择器的长度不应该是一个考虑因素。性能,可读性和可维护性应该是。
答案 1 :(得分:0)
我通常更喜欢类方法。原因是您不必为系统中的每个新ID元素编写新的css选择器。
另外,我倾向于区分“结构”和“风格”CSS。这意味着,我将处理大小(宽度/高度)和位置的事物与执行字体粗细,颜色等的css类分开。
对于不变的结构框架,我将使用ID。对于HTML中可能有多个表示的部分,我将坚持使用类机制。