jquery设置样式
使用 jQuery 设置样式的方法
直接设置单个样式属性
通过 .css() 方法可以直接设置单个 CSS 属性。第一个参数是属性名，第二个参数是属性值。
$('#element').css('color', 'red');
$('.class').css('background-color', '#fff');批量设置多个样式属性
传递一个对象给 .css() 方法，可以一次性设置多个样式属性。
$('#element').css({
'font-size': '16px',
'padding': '10px',
'border': '1px solid black'
});动态计算样式值
可以在 .css() 方法中使用函数动态计算样式值，函数的参数是元素索引和当前样式值。
$('div').css('width', function(index, value) {
return parseInt(value) + 10 + 'px';
});添加和移除类
通过 .addClass() 和 .removeClass() 方法可以添加或移除预定义的 CSS 类。
$('#element').addClass('active');
$('#element').removeClass('inactive');切换类
使用 .toggleClass() 方法可以在添加和移除类之间切换。
$('#button').click(function() {
$('#element').toggleClass('highlight');
});获取样式值
通过 .css() 方法传入单个属性名可以获取该属性的值。
var color = $('#element').css('color');
var fontSize = $('.text').css('font-size');注意事项
- 属性名可以使用驼峰式（如
backgroundColor）或连字符式（如background-color） - 数值类属性需要包含单位（如
px,em等） - 通过类操作样式比直接修改 CSS 属性更高效，特别是在需要频繁修改样式时
