为什么我们不使用setAttribute方法来设置元素的class?

我们通过Js脚本对DOM 节点进行修改其样式class的时候，常常是使用如下的方式进行操作：

element.className = 'xxxClass';

而我们知道，element中有一个设置属性值的API——setAttribute(propertyName, propertyValue);那么我们会想，是否可以通过调用该API进行设置元素的样式class呢？答案是肯定的，代码如下：

element.setAttribute('className', 'xxxClass');

但通过在IE，FireFox，Chrome，safari，Opera等浏览器测试中发现，第二种设置样式class的方法，只能在IE下生效，而其他W3C标准的浏览器是无效的。

但通过改成另外一种方式，则在W3C下是生效的，但在IE下是无效的：

element.setAttribute('class', 'xxxClass');

从上面的结论中，我们可以看出，如果要使用setAttribute方法对元素节点进行设置样式class，则必须针对IE和其他W3C标准的浏览器分别设置class和className的属性名，但使用下面的快捷方式，则在各个浏览器中均有效：

element.className = 'xxxClass';

这就是为什么我们需要直接使用className进行设置的原因。