• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
逍遥汉
博客园    首页    新随笔    联系   管理    订阅  订阅

5jQuery中对样式的常用操作

jQuery中常用的样式操作有两种:css() 和 设置类样式方法

方法1: 操作 css 方法

jQuery 可以使用 css 方法来修改简单元素样式; 也可以操作类,修改多个样式。常用以下三种形式 :

 1 // 1.参数只写属性名,则是返回属性值
 2 
 3 var strColor = $(this).css('color');
 4 
 5 // 2.  参数是属性名,属性值,逗号分隔,是设置一组样式,属性必须加引号,值如果是数字可以不用跟单位和引号
 6 
 7 $(this).css(''color'', ''red'');
 8 
 9 // 3.  参数可以是对象形式,方便设置多组样式。属性名和属性值用冒号隔开, 属性可以不用加引号
10 
11 $(this).css({ "color":"white","font-size":"20px"});

注意:css() 多用于样式少时操作,多了则不太方便。

方法2: 设置类样式方法

作用等同于以前的 classList,可以操作类样式, 注意操作类里面的参数不要加点。常用的三种设置类样式方法:

 1 // 1.添加类
 2 
 3     $("div").addClass("current");
 4 
 5 // 2.删除类
 6 
 7     $("div").removeClass("current");
 8 
 9 // 3.切换类
10 
11     $("div").toggleClass("current");

注意:

  1. 设置类样式方法比较适合样式多时操作,可以弥补css()的不足。

  2. 原生 JS 中 className 会覆盖元素原先里面的类名,jQuery 里面类操作只是对指定类进行操作,不影响原先的类名。

 

时间如白驹过隙,忽然而已,且行且珍惜......
posted @ 2020-09-25 23:49  unfetteredman  阅读(103)  评论(0)    收藏  举报
刷新页面返回顶部
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3