jQuery库中的一些操作样式的函数

最新推荐文章于 2025-11-26 15:59:01 发布

原创最新推荐文章于 2025-11-26 15:59:01 发布 · 633 阅读

CC 4.0 BY-SA版权

文章标签：

3 篇文章

订阅专栏

本文介绍了jQuery库如何轻松操作DOM元素的样式，包括获取、设置、批量设置样式，以及添加、移除和切换类的方法，提供简洁的API来处理CSS相关需求。

jQuery提供了一种简单、方便的方式来操作DOM元素的样式。这些操作可以单独使用，也可以组合在一起使用以满足更复杂的需求。

css() 函数：
- 获取一个样式：$(selector).css(propertyName)。这等同于使用DOM元素的 style 属性直接访问样式名称（需要使用驼峰式命名）。例如：$('#myElement').css('backgroundColor')。
- 设置一个样式：$(selector).css(propertyName, value)。这等同于使用DOM元素的 style 属性直接设置样式值（需要使用驼峰式命名）。例如：$('#myElement').css('backgroundColor', 'red')。
- 批量设置样式：$(selector).css({ propertyName: value, propertyName: value })。这等同于一次性设置多个样式，例如：$('#myElement').css({ 'background-color': 'red', 'font-size': '16px' })。
addClass() 函数：用于向选定的元素添加一个或多个类。例如：$('#myElement').addClass('myClass')。
removeClass() 函数：用于从选定的元素移除一个或多个类。例如：$('#myElement').removeClass('myClass')。
toggleClass() 函数：用于切换选定元素的一个或多个类。如果类存在则移除，如果不存在则添加。例如：$('#myElement').toggleClass('myClass')。