国外有篇文章叫《Efficiently Rendering CSS》里面讲到ID选择器是最有效率的，我不这样认为，某些方面，id与class在渲染效率上不相上下,所以没有到必须的时候，个人建议使用class作为选择器,具体可以看下面的效率测试。

首先讲几个前提：
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
css渲染分三种情况
1.首次加载渲染
2.css和html调用缓存渲染
3.html文件调用缓存渲染

渲染的顺序
ff,chrome,safari,opera 最新版本的浏览器是在加载的同时进行css样式的渲染和展现(或者说是同步进行)。
而ie 8 是在文档加载完成后展现，而在渲染过程中是无法见到网页展现的

渲染效率与什么有关？
1.css选择器的查询定位效率
2.浏览器的渲染模式和算法
3.要进行渲染内容的大小

测试：

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
OS ：win xp
硬件：内存 4G，CPU 酷睿4核
web容器：tomcat 6.0

浏览器 ：ff 3.6

说明:
1.为使得结果更加客观真实，html文档包含各种标签元素
2.样式用在了class元素上和id的元素上
3.id选择器和class选择器的渲染测试，每一项测试30次，取均值

html文件
html files.rar (9.25 KB)

结果对比：

序号

选择器

首次载入(s)

刷新页面(s)

修改属性值后刷新(s)

选择器

首次载入(s)

刷新页面(s)

修改属性值后刷新 (s)

1.

.box

4.55

4.38

4.77

#wrap

4.55

5.02

4.48

2.

4.54

4.4

4.74

4.49

4.34

4.55

30.

4.52

4.32

4.53

4.56

4.35

4.5

均值

4.627

4.503

4.839

4.534

4.403

4.441



结论：
－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
就整个文档的首次载入和刷新的渲染效率来看，id比class快0.1s左右，可以说不相上下。
在修改css属性值后刷新，id的速度比class快0.4s作用
若：
修改background-color值后刷新用时－刷新页面用时 ＝ 这个属性的渲染用时
则：
class选择器属性渲染用时为 4.839s－4.503s ＝ 0.436s
id选择器属性渲染用时为 4.441s－4.403s ＝ 0.038s
即:
id选择器属性渲染 比 class 选择器属性渲染 快约 0.4s
所以：id选择器的效率和class选择器相比是很微小的，可以认为两者不相上下