jquery修改style属性

修改单个样式属性

使用css()方法可以直接修改元素的单个样式属性。该方法接受属性名和值作为参数。

$("#elementId").css("color", "red");

修改多个样式属性

通过传递一个对象到css()方法，可以一次性修改多个样式属性。对象的键是样式属性名，值是对应的样式值。

$("#elementId").css({
  "color": "blue",
  "font-size": "16px",
  "background-color": "#f0f0f0"
});

获取样式属性值

css()方法也可以用于获取元素的样式属性值。只需传递属性名作为参数。

var color = $("#elementId").css("color");

使用变量动态设置样式

可以将样式值存储在变量中，然后通过css()方法应用到元素上。

var newWidth = "200px";
$("#elementId").css("width", newWidth);

添加或移除CSS类

通过addClass()和removeClass()方法可以添加或移除预定义的CSS类，从而间接修改元素的样式。

$("#elementId").addClass("highlight");
$("#elementId").removeClass("inactive");

切换CSS类

使用toggleClass()方法可以在添加和移除CSS类之间切换。

$("#elementId").toggleClass("active");

直接操作style属性

通过attr()方法可以直接获取或设置元素的style属性。

$("#elementId").attr("style", "color: green; font-weight: bold;");