jquery如何判断某元素是否具备指定的样式


Posted in Javascript onNovember 05, 2013

分为以下2种情况:
1.如果css写成行内样式,可以通过获取style属性的值来判断,示例如下:
判断id为divid的div元素是否有font-size样式:

<div id="divid" style="float:left; font-size:12px;"></div> 
jquery代码如下: 
jQuery("#divid").each(function(){ 
var fontSize = $(this).attr("style").indexOf("font-size"); 
if(fontSize != (-1)){alert("已定义");} 
else{$(this).css({"float":"left","font-size":"12px"});} 
});

注:如果id为divid的div元素只有一个,则jquery的each只执行一次。
2.如果css写成类样式,可以通过获取class属性的值来判断,示例如下:
判断id为divid的div元素是否含有类样式divclass:
.divclass{ 
background-color: #F33; 
} 
<div id="divid" class="divclass"></div>

jquery代码如下:
jQuery("#divid").click(function(){ 
if(jQuery(this).attr("class").indexOf("divclass")>0){ 
jQuery(this).removeClass("divclass") 
}else{ 
jQuery(this).addClass("divclass") 
} 
});

注:以上代码可以实现点击切换背景颜色。
Javascript 相关文章推荐
javascript 函数速查表
Feb 07 Javascript
extjs grid设置某列背景颜色和字体颜色的方法
Sep 03 Javascript
js操作table示例(个人心得)
Nov 29 Javascript
jQuery移动端图片上传组件
Jun 12 Javascript
原生JS实现垂直手风琴效果
Feb 19 Javascript
React中上传图片到七牛的示例代码
Oct 10 Javascript
JavaScript中Require调用js的实例分享
Oct 27 Javascript
AngularJs分页插件使用详解
Jun 30 Javascript
JavaScript创建对象方法实例小结
Sep 03 Javascript
浅谈JavaScript闭包
Apr 09 Javascript
使用Webpack 搭建 Vue3 开发环境过程详解
Jul 28 Javascript
Vue 实现对quill-editor组件中的工具栏添加title
Aug 03 Javascript
使用js声明数组,对象在jsp页面中(获得ajax得到json数据)
Nov 05 #Javascript
js截取字符串的两种方法及区别详解
Nov 05 #Javascript
js实现在字符串中提取数字
Nov 05 #Javascript
提取字符串中年月日的函数代码
Nov 05 #Javascript
纯js分页代码(简洁实用)
Nov 05 #Javascript
js对列表中第一个值处理与jsp页面对列表中第一个值处理的区别详解
Nov 05 #Javascript
js/jquery去掉空格,回车,换行示例代码
Nov 05 #Javascript
You might like
玛琪朵 Macchiato
2021/03/03 咖啡文化
php常用hash加密函数
2014/11/22 PHP
php使用正则表达式去掉html中的注释方法
2016/11/03 PHP
PHP回调函数简单用法示例
2019/05/08 PHP
javascript生成/解析dom的CDATA类型的字段的代码
2007/04/22 Javascript
Javascript的匿名函数小结
2009/12/31 Javascript
3分钟写出来的Jquery版checkbox全选反选功能
2013/10/23 Javascript
微信小程序开发之录音机 音频播放 动画实例 (真机可用)
2016/12/08 Javascript
zTree实现节点修改的实时刷新功能
2017/03/20 Javascript
JS验证输入的是否是数字及保留几位小数问题
2018/05/09 Javascript
vue组件实现进度条效果
2018/06/06 Javascript
JSONP原理及应用实例详解
2018/09/13 Javascript
pymongo实现控制mongodb中数字字段做加法的方法
2015/03/26 Python
Python线程的两种编程方式
2015/04/14 Python
Python实现输出某区间范围内全部素数的方法
2018/05/02 Python
Django rest framework实现分页的示例
2018/05/24 Python
python dataframe常见操作方法:实现取行、列、切片、统计特征值
2018/06/09 Python
Django中的ajax请求
2018/10/19 Python
python调用matlab的m自定义函数方法
2019/02/18 Python
Python的bit_length函数来二进制的位数方法
2019/08/27 Python
利用PyQt中的QThread类实现多线程
2020/02/18 Python
python之生成多层json结构的实现
2020/02/27 Python
python openssl模块安装及用法
2020/12/06 Python
喜之郎果冻广告词
2014/03/20 职场文书
护士上岗前培训自我鉴定
2014/04/20 职场文书
大学生工作自荐书
2014/06/16 职场文书
2014年公务员退休工资改革方案
2014/10/01 职场文书
2015年健康教育工作总结
2015/04/10 职场文书
食品安全责任书范本
2015/05/09 职场文书
2016年校长新年寄语
2015/08/17 职场文书
2016中秋节月饼促销广告语
2016/01/28 职场文书
mysql5.7使用binlog 恢复数据的方法
2021/06/03 MySQL
Python类方法总结讲解
2021/07/26 Python
win11无法登录onedrive错误代码0x8004def7怎么办 ?
2022/04/05 数码科技
Golang 结构体数据集合
2022/04/22 Golang
向Spring IOC 容器动态注册bean实现方式
2022/07/15 Java/Android