jquery改变css样式
修改单个CSS属性
使用.css()方法直接修改元素的单个样式属性。该方法接受属性名和值作为参数，支持驼峰式或连字符写法。
$("#element").css("color", "red");
$("#element").css("backgroundColor", "#fff"); // 驼峰式
$("#element").css("font-size", "16px"); // 连字符式 批量修改多个CSS属性
传递一个对象到.css()方法，键为CSS属性名，值为对应的样式值。适合同时修改多个属性。
$("#element").css({
"color": "blue",
"font-size": "14px",
"margin": "10px"
}); 动态计算样式值
通过函数返回值动态设置样式，函数接收元素索引和当前样式值作为参数。
$(".items").css("width", function(index, currentWidth) {
return parseInt(currentWidth) + 10 + "px";
}); 切换类名修改样式
使用.addClass()、.removeClass()或.toggleClass()通过预定义的CSS类批量修改样式。
$("#element").addClass("highlight"); // 添加类
$("#element").removeClass("inactive"); // 移除类
$("#element").toggleClass("active"); // 切换类 注意事项
- 连字符属性名需加引号（如
"font-size"），驼峰式可省略。 - 数值类属性（如
width）需包含单位（如px），除非值为无单位数字（如z-index）。 - 修改样式后可能触发浏览器重绘，频繁操作建议使用类名切换优化性能。
