DOM扩展之 HTML5

11.3.1 与类相关的扩充

  2. classList属性

  在操作类名时，需要通过className属性添加，删除和替换类名。因为className是一个字符串，所以即使只修改一部分内容也要设置整个字符串的值。

  如<div class="user name age"></div> 则其className 为"user name age"。

  HTML5新增了一种操作类名的方式，即为所有元素添加了classList属性。classList属性是新集合类型DOMTokenList的实例。 与其他DOM集合类似，DOMTokenList有一个表示自己有多少元素的length属性，

取得每个元素可以使用item()方法，也可以使用方括号语法。

 新类型还定义如下方法：

1.   add(value)
2. contains(value)
3. remove(value)
4. toggle(value)

如： div.classList.remove("user")

11.3.5 自定义数据属性

 HTML5规定可以为元素添加自定义属性，格式是 data-**的形式，目的是为元素提供与渲染无关的信息，或者提供语义信息。

如：<div id="mydiv" data-user="42342324"></div>

添加之后，可以通过元素的dataset属性来访问自定义属性的值。dataset属性的值是DOMStringMap的一个实例，也就是一个名值对映射。在这个映射中每一个data-**形式的自定义属性都有一个对应的映射，只不过属性名没有data-前缀。

 var user =document.getElementById('#mydiv').dataset.user; //42342324