在Javaｓｃｒｉｐｔ和Javaｓｃｒｉｐｔ工具库多年，我经常有这样的想法：什么现代浏览器可以提供一些辅助的方法和图书馆，以取代Javaｓｃｒｉｐｔ工具库，如jQuery，我们取代他们的原生浏览器。我知道浏览器会提高这一方向，但这个过程是不很快，而且各种常见的浏览器需要做这样的创新，火狐，谷歌浏览器，特别是IE，只有当主流浏览器有这样的功能，我们将真正实现。好消息是，这一功能已被添加到HTML5的API列表。

在HTML5的API，有一个列表对象在页面的DOM节点，程序员可以添加，删除，修改页面中的节点的CSS类，列表，程序员也可以用它来确定一个节点是否是给定一个特定的CSS类。

element.classlist

本列表对象的许多有用的方法：

xml代码将内容复制到剪贴板。


{
长度：{数量}，对这类元素# / * * /
添加：函数（）{本地代码}，
包含：函数（）{本地代码}，
项目：函数（{本地的）{
删除：函数（）{本地代码}，
函数（）{本地代码}
}





正如你可以看到上面的element.classlist类是非常小的，但每种方法里面是很有用的。

新的CSS类

使用Add方法，您可以向页面元素添加一个或多个CSS类：

MyDiv.classList.add（'mycssclass）；

删除CSS类

使用删除方法，可以删除单个CSS类：

MyDiv.classList.remove（'mycssclass）；

在这个方法中，您可以一次将多个类名传递到空间中，但执行结果可能不被期望。

CSS类的反转

MyDiv.classList.toggle（'mycssclass '）； / /现在是增加
MyDiv.classList.toggle（'mycssclass '）； / /现在被删除

这种方法的功能是，当mydiv元没有CSS类，添加CSS类。如果mydiv元已有的CSS类，它会删除它。它是反向操作。

检查是否有CSS类

mydiv.classlist.contains（'mycssclass '）； / /返回真或假

目前，所有现代浏览器（火狐、谷歌浏览器等）中的列表类支持，以便将新的Javaｓｃｒｉｐｔ类库使用列表类的CSS类的操作页面，而不需要分析的元素节点的属性类如前！

以上是本文的全部内容，希望能对您有所帮助，希望大家多多支持。