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 去除数组的重复元素
May 04 Javascript
JS数学函数Exp使用说明
Aug 09 Javascript
如何获取select下拉框的值(option没有及有value属性)
Nov 08 Javascript
javaScript中的this示例学习详解及工作原理
Jan 13 Javascript
js为什么不能正确处理小数运算?
Dec 29 Javascript
纯js仿淘宝京东商品放大镜功能
Mar 02 Javascript
js中的面向对象入门
Mar 06 Javascript
JavaScript数据结构之二叉树的查找算法示例
Apr 13 Javascript
JS验证码实现代码
Sep 14 Javascript
js判断输入框不能为空格或null值的实现方法
Mar 02 Javascript
改变vue请求过来的数据中的某一项值的方法(详解)
Mar 08 Javascript
Vue+webpack实现懒加载过程解析
Feb 17 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
通过文字传递创建的图形按钮
2006/10/09 PHP
最新版本PHP 7 vs HHVM 多角度比较
2016/02/14 PHP
CI框架源码解读之利用Hook.php文件完成功能扩展的方法
2016/05/18 PHP
PHP实现的曲线统计图表示例
2016/11/10 PHP
thinkPHP框架实现多表查询的方法
2018/06/14 PHP
JavaScript入门教程(5) js Screen屏幕对象
2009/01/31 Javascript
JS下载文件|无刷新下载文件示例代码
2014/04/17 Javascript
JavaScript判断前缀、后缀是否是空格的方法
2015/04/15 Javascript
javascript时间戳和日期字符串相互转换代码(超简单)
2016/06/22 Javascript
JS上传图片预览插件制作(兼容到IE6)
2016/08/07 Javascript
浅谈jQuery绑定事件会叠加的解决方法和心得总结
2016/10/26 Javascript
canvas实现爱心和彩虹雨效果
2017/03/09 Javascript
vue.js默认路由不加载linkActiveClass问题的解决方法
2017/12/11 Javascript
vue实现提示保存后退出的方法
2018/03/15 Javascript
深入浅析javascript函数中with
2018/10/28 Javascript
vue props 单项数据流实例分享
2020/02/16 Javascript
Python中函数及默认参数的定义与调用操作实例分析
2017/07/25 Python
关于tf.nn.dynamic_rnn返回值详解
2020/01/20 Python
python名片管理系统开发
2020/06/18 Python
python实现网页录音效果
2020/10/26 Python
CSS3实现滚动条动画效果代码分享
2016/08/03 HTML / CSS
基于HTML5的WebSocket的实例代码
2018/08/15 HTML / CSS
HTML 5 input placeholder 属性如何完美兼任ie
2014/05/12 HTML / CSS
中国专业的音频分享平台:喜马拉雅
2019/05/24 全球购物
乌克兰电子和家用电器商店:Foxtrot
2019/07/23 全球购物
说一下Linux下有关用户和组管理的命令
2014/08/18 面试题
机械设计及其自动化专业推荐信
2013/10/31 职场文书
大学生最常用的自我评价
2013/12/07 职场文书
车间安全生产标语
2014/06/06 职场文书
中学生社会实践活动总结
2014/07/03 职场文书
2014年科室工作总结
2014/11/20 职场文书
学习经验交流会演讲稿
2015/11/02 职场文书
大学生入党自我鉴定范文
2019/06/21 职场文书
MySQL数据库中varchar类型的数字比较大小的方法
2021/11/17 MySQL
在 HTML 页面中使用 React的场景分析
2022/01/18 Javascript
Django框架中视图的用法
2022/06/10 Python