编辑这个页面须要登录或更高权限！

jQuery addClass() 方法

jQuery HTML/CSS 方法

addClass()方法将一个或多个类名称添加到所选元素。

此方法不会删除现有的类属性，而只会向该类属性添加一个或多个类名称。

语法：

添加类别：

$(selector).addClass(className)

使用函数添加类：

$(selector).addClass(function(index, currentClass))

实例

在第一个<p>元素中添加一个类名：

$("button").click(function(){
  $("p:first").addClass("highlight");
});
测试看看‹/›

一次可以将多个类（用空格隔开）添加到所选元素，如下所示：

$("button").click(function(){
  $("p:first").addClass("highlight big");
});
测试看看‹/›

使用函数添加类：

$("p").addClass(function(index, currentClass) {
  let addedClass;
  if(currentClass === "red") {
    addedClass = "green";
    $(this).text("有一个绿色的段落");
  }
  return addedClass;
});
测试看看‹/›

使用removeClass()删除一个类名，并用addClass()添加一个新的类名：

$("button").click(function(){
  $("p").removeClass("red").addClass("green");
});
测试看看‹/›

参数值

参数描述
className指定要添加的一个或多个以空格分隔的类名
function(index, currentClass)函数，该函数返回一个或多个以空格分隔的类名称，以将其添加到现有的类名称中

  • index-返回元素在集合中的索引位置

  • currentClass-返回所选元素的当前类名称

jQuery HTML/CSS 方法

jQuery 遍历方法jQuery HTML/CSS 方法