jquery设置样式

使用 jQuery 设置样式

jQuery 提供了多种方法来操作元素的 CSS 样式，以下是常用的几种方式：

直接设置单个样式属性

使用 .css() 方法可以设置单个 CSS 属性：

$('#element').css('color', 'red');

设置多个样式属性

通过传递一个对象来同时设置多个样式：

$('#element').css({
  'color': 'red',
  'background-color': 'blue',
  'font-size': '16px'
});

添加/移除类

使用 .addClass() 和 .removeClass() 方法来添加或移除 CSS 类：

$('#element').addClass('highlight');
$('#element').removeClass('inactive');

切换类

使用 .toggleClass() 方法在添加和移除类之间切换：

$('#element').toggleClass('active');

获取样式值

使用 .css() 方法获取元素的样式值：

var color = $('#element').css('color');
console.log(color); // 输出 'red' 或其他当前颜色值

注意事项

• jQuery 的样式操作会自动处理浏览器兼容性问题。
• 对于性能敏感的场景，直接操作类名比逐个修改样式属性更高效。
• 修改后的样式会直接反映在元素的 style 属性中，优先级高于外部样式表。