jquery 样式
jQuery 样式操作
jQuery 提供了多种方法来操作 HTML 元素的样式，包括直接修改 CSS 属性、添加或移除类、获取样式值等。
修改 CSS 属性
使用 css() 方法可以直接修改元素的 CSS 属性。该方法可以接受单个属性或一组属性。
// 修改单个属性
$("#element").css("color", "red");
// 修改多个属性
$("#element").css({
"color": "red",
"font-size": "16px",
"background-color": "#f0f0f0"
});添加或移除类
使用 addClass()、removeClass() 和 toggleClass() 方法可以动态添加、移除或切换元素的类。
// 添加类
$("#element").addClass("active");
// 移除类
$("#element").removeClass("inactive");
// 切换类
$("#element").toggleClass("highlight");获取样式值
使用 css() 方法可以获取元素的当前样式值。
var color = $("#element").css("color");
console.log(color); // 输出当前颜色值动画效果
jQuery 还提供了动画效果的方法，如 animate()，可以动态改变样式属性。
$("#element").animate({
opacity: 0.5,
left: "50px",
height: "200px"
}, 1000);注意事项
- 使用
css()方法修改样式时，属性名可以使用驼峰式（如fontSize）或连字符式（如font-size）。 - 通过类操作样式时，建议将样式定义在 CSS 文件中，而不是直接通过 JavaScript 修改。
- 动画效果可以通过设置持续时间（毫秒）或使用预定义字符串（如
"slow"、"fast"）来控制速度。
