全部教程· JavaScript· jQuery · 获取设置 CSS 类

返回

jQuery 获取并设置 CSS 类

通过 jQuery，可以很容易地对 CSS 元素进行操作。

1. jQuery 操作 CSS

jQuery 拥有若干进行 CSS 操作的方法。我们将学习下面这些：

addClass() - 向被选元素添加一个或多个类
removeClass() - 从被选元素删除一个或多个类
toggleClass() - 对被选元素进行添加/删除类的切换操作
css() - 设置或返回样式属性

2. 范例样式表

下面的样式表将用于本页的所有例子：

.important
{
font-weight:bold;
font-size:xx-large;
}
.blue
{
color:blue;
}

3. jQuery addClass() 方法

下面的例子展示如何向不同的元素添加 class 属性。当然，在添加类时，您也可以选取多个元素：

范例

$("button").click(function(){
  $("h1,h2,p").addClass("blue");
  $("div").addClass("important");
});

您也可以在 addClass() 方法中规定多个类：

范例

$("button").click(function(){
  $("#div1").addClass("important blue");
});

4. jQuery removeClass() 方法

下面的例子演示如何不同的元素中删除指定的 class 属性：

范例

$("button").click(function(){
  $("h1,h2,p").removeClass("blue");
});

5. jQuery toggleClass() 方法

下面的例子将展示如何使用 jQuery toggleClass() 方法。该方法对被选元素进行添加/删除类的切换操作：

范例

$("button").click(function(){
  $("h1,h2,p").toggleClass("blue");
});

下一章：jQuery CSS() 方法

jQuery - css() 方法：css() 方法设置或返回被选元素的一个或多个样式属性。如需返回指定的 CSS 属性的值，请使用如下语法：css("propertyname");如需设置指定的 CSS 属性，请使用如下语法：css("propertyname","value")

上一章：jQuery 删除元素

下一章：jQuery CSS() 方法

小贴士

全部【编程教程】内容源自网络，仅供学习用途，若有遗漏或版权任何问题，请及时【联系我们】，按下 Ctrl+D 或 ⌘+D 收藏本站。

快速标题定位

1. jQuery 操作 CSS
2. 范例样式表
3. jQuery addClass() 方法
4. jQuery removeClass() 方法
5. jQuery toggleClass() 方法

他人最近浏览

用户 8小时前浏览了 [Java编程技术] 的 [解决Springboot全局异常处理与AOP日志处理中@AfterThrowing失效问题的方法]
用户 8小时前浏览了 [C++教程] 的 [C++ 环境设置]
用户 8小时前浏览了 [Xorm框架] 的 [Xorm Rows方法]
用户 8小时前浏览了 [Numpy] 的 [NumPy 创建数组]
用户 8小时前浏览了 [通过例子学Rust] 的 [13.1 死代码]
用户 8小时前浏览了 [FuelPHP] 的 [FuelPHP 电子邮件管理]
用户 8小时前浏览了 [排序算法] 的 [基数排序]
用户 8小时前浏览了 [Go语言高级编程] 的 [6.5 负载均衡]
用户 8小时前浏览了 [MySQL] 的 [MySQL DELETE 语句]
用户 8小时前浏览了 [编程面试题集锦] 的 [阿里面试技术手册（二）：大型网站架构演化发展历程]

推荐 AI 小工具

Janitor AI 角色扮演聊天

在问

CapCut剪映专业版

抖音Dreamina – 免费

喵呜提示词助手

Vmake

Zion无代码开发平台

呱呱有声-制作平台

轻松鲨

灵感狮 – 免费AI创作

唱鸭 AI自动作曲

笔灵AI写作

关于我们/ 免责声明/ 问与答/ 积分奖励消耗规则/ 联系我们/ Markdown 教程

欢迎来到 AI 中文社区（简称 AI 中文社），这里是学习交流 AI 人工智能技术的中文社区。为了更好的体验，本站推荐使用 Chrome 浏览器。