jquery添加class属性

jQuery 添加 class 属性

使用 jQuery 为元素添加 class 属性可以通过 .addClass() 方法实现。该方法允许动态地为选中的元素添加一个或多个 class 名称。

语法

$(selector).addClass(className);

• selector：目标元素的选择器（如 #id、.class 或 element）。
• className：要添加的 class 名称（字符串形式），多个 class 可用空格分隔。

示例代码

// 为 id="example" 的元素添加单个 class
$("#example").addClass("highlight");

// 为所有段落元素添加多个 class
$("p").addClass("text-bold text-red");

动态切换 class

如果需要根据条件动态添加或移除 class，可以结合逻辑判断：

if (condition) {
    $("#element").addClass("active");
} else {
    $("#element").removeClass("active");
}

链式操作

jQuery 支持链式调用，可以在同一语句中连续操作：

$("#box").addClass("border").css("color", "blue");

注意事项

• 重复添加同名 class 不会重复生效，浏览器会自动去重。
• class 名称需符合 HTML 规范（避免空格或特殊字符开头）。