JQ修改css样式小结

1、修改标签属性

$(选择器).attr('style','属性:属性值');// 如:$('.attr').attr('style','color:red');

注:不过,此方法有一个不足之处。即:不论是你修改样式还是添加别的样式,都会覆盖之前所有的样式。如需保留之前的样式,则需要重新写一遍。

2、修改标签className

  • 添加CSS类(addClass('类名')
$(选择器).addClass('类名'); // 如:$('.attr').addClass('color');
  • 删除CSS类(removeClass('类名')
$(选择器).removeClass('类名');// 如:$('.attr').removeClass('color');
  • 添加或者移除CSS类toggleClass('类名')
$(选择器).toggleClass('类名');// 如:$('.attr').toggleClass('color');

注:如果css类存在,则删除css类;反之,则添加css类。

3、直接修改CSS样式

$(选择器).css('属性','属性值');// 如:$('.attr').css('color','red');

注:修改一个样式属性。

$(选择器).css({'属性':'属性值',['属性':'属性值']});// 如:$('.attr').css({'color':'red','font-size':'12px'});

注:修改一个或者多个样式属性。‘[]’表示可省略。

4、修改样式表的内容

$(选择器).css('cssText','属性:属性值');// 如:$('.attr').css('cssText','color:red');

注:可修改样式表中的样式,有时通过直接修改css样式时无法在其属性值后面添加“!important”,这时就可以用此方法实现修改样式。


如果你想通过cssText属性批量修改样式,可访问:http://www.cnblogs.com/snandy/archive/2011/03/12/1980444.html


此文主用于笔记,以免以后忘记……文中重点在于:cssText的用法


  • 4
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值