第一百二十四章 Class 的变换

如果某个元素需要改变的样式比较多，一般我们并不会使用 css 方法，这个效率不够高，写着麻烦，阅读也麻烦。

我们对自己的程序应该有一个规划，元素的样式从某个状态，变到另一个状态，这是预先计划好的，不是程序运行中的一时兴起。而这两种状态可以用不同的 class 来表示。这也是一个很惯常，很标准的用法。

我们就可以先预设几个 class 的样式，然后在需要的时候给对应的元素增减相应的 class。

$('#people').removeClass('bad-man');$('#people').addClass('good-man');

单词都比较熟悉了，反反复复出现，我就不多解释了，注意 jQuery 使用的是小驼峰的命名方法。

适时的添加和移除元素的类，这是一种很常见，也很有用的操作。深入一些，这是一种思维方式，贴标签，归类，分组……怎么理解都可以，要掌握，还要善于去利用这种方式。

不过有时候我们关心的可能不是当前状态，而是状态变换。这个按钮，不是开，也不是关，而是开关。是在开/关这两个状态下不断切换。点一下打开，再点一下关上……

我们可以在每次点击的时候先判断一下处于什么状态，然后进行对应的，类的添加删除。但这样重复的操作很烦人，所以我们有了类的切换。

$('#people').toggleClass('sleeping');

不去关注当前状态是什么，总之，如果元素当前有这个类，那就把这个类移除；如果没有，就给加上。

这是切换，我们以后还有好多操作会涉及到切换，都是类似的思想。

好了，又讲完了，这一章更短啊！

知识很简单，但是怎么灵活地去运用，这简直是一门艺术，有点工匠的精神，去做，去练习，去尝试，去琢磨……把简单的东西也打磨的熠熠生辉。