第一百二十四章 Class 的变换

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

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

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

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

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

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

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

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

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

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

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

好了,又讲完了,这一章更短啊!

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

原文链接:https://www.ek58.com/archives/3772,转载请注明出处。

0

评论0

请先

没有账号? 注册  忘记密码?