jQuery获取并设置CSS类
<!DOCTYPE html> <html> <head> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <title>jquery访问css类</title> <style> .lay-table-cell{ width:100px; height:150px; } .box{ border:aqua; } .text{ font-weight: bold } </style> </head> <body> <div class="lay-table-cell"> <p>jquery</p> </div> <script> $(function(){ //1 获取该类某个属性 console.log($('.lay-table-cell').css('height')); //2 设置单个属性 $('.lay-table-cell').css('background', 'red'); //3 设置多个属性 $('.lay-table-cell').css({'font-size': '25px','color': '#fff'}); //4 向被选元素添加一个或多个类 $('.lay-table-cell').addClass('box'); //5 向被选元素删除一个或多个类 $('.lay-table-cell').removeClass('box'); //6 检查被选元素是否包含指定的class console.log($('.lay-table-cell').hasClass('text')); $('.lay-table-cell').click(function() { if ($(this).hasClass('text')) { $(this).removeClass('text'); } else { $(this).addClass('text'); } console.log($('.lay-table-cell').hasClass('text')); }) }) </script> </body> </html>
原文参考:https://blog.csdn.net/weixin_33751984/article/details/119401675
标签:
Jquery
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?