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 相关文章推荐
URL编码转换,escape() encodeURI() encodeURIComponent()
Dec 27 Javascript
struts2 jquery 打造无限层次的树
Oct 23 Javascript
为JavaScript添加重载函数的辅助方法
Jul 04 Javascript
在JavaScript应用中使用RequireJS来实现延迟加载
Jul 01 Javascript
jQuery拖动元素并对元素进行重新排序
Dec 30 Javascript
js下将金额数字每三位一逗号分隔
Feb 19 Javascript
JavaScript是如何实现继承的(六种方式)
Mar 31 Javascript
javascript中闭包概念与用法深入理解
Dec 15 Javascript
Angularjs 与 bower安装和使用详解
May 11 Javascript
vue-router路由懒加载和权限控制详解
Dec 13 Javascript
ReactNative实现Toast的示例
Dec 31 Javascript
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
Jun 10 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
在php和MySql中计算时间差的方法
2011/04/22 PHP
ThinkPHP实现多数据库连接的解决方法
2014/07/01 PHP
php随机生成数字字母组合的方法
2015/03/18 PHP
基于PHP实现的事件机制实例分析
2015/06/18 PHP
百度地图经纬度转换到腾讯地图/Google 对应的经纬度
2015/08/28 PHP
php生成4位数字验证码的实现代码
2015/11/23 PHP
JavaScript的eval JSON object问题
2009/11/15 Javascript
jquery1.4.2 for Visual studio 2010 模板文件
2010/07/14 Javascript
js实现的复制兼容chrome和IE
2014/04/03 Javascript
JavaScript利用正则表达式去除日期中的“-”
2014/07/01 Javascript
Jquery实现动态切换图片的方法
2015/05/18 Javascript
AngularJS指令详解及示例代码
2016/08/16 Javascript
利用Query+bootstrap和js两种方式实现日期选择器
2017/01/10 Javascript
webpack实现热加载自动刷新的方法
2017/07/30 Javascript
一次记住JavaScript的6个正则表达式方法
2018/02/22 Javascript
vue指令之表单控件绑定v-model v-model与v-bind结合使用
2019/04/17 Javascript
Django实现的自定义访问日志模块示例
2017/06/23 Python
python获取代理IP的实例分享
2018/05/07 Python
Python使用pandas和xlsxwriter读写xlsx文件的方法示例
2019/04/09 Python
django页面跳转问题及注意事项
2019/07/18 Python
pytorch中如何使用DataLoader对数据集进行批处理的方法
2019/08/06 Python
css3media响应式布局实例
2016/07/08 HTML / CSS
h5网页水印SDK的实现代码示例
2019/02/19 HTML / CSS
国际象棋商店:The Chess Store
2018/07/09 全球购物
学生自我鉴定模板
2013/12/30 职场文书
建筑设计学生的自我评价
2014/01/16 职场文书
宾馆总经理岗位职责
2014/02/14 职场文书
篝火晚会策划方案
2014/05/16 职场文书
服务口号大全
2014/06/11 职场文书
小区的门卫岗位职责
2014/10/01 职场文书
村支部书记群众路线对照检查材料思想汇报
2014/10/08 职场文书
班主任工作总结范文
2015/08/13 职场文书
导游词之淮安明祖陵
2019/11/25 职场文书
Redis源码阅读:Redis字符串SDS详解
2021/07/15 Redis
GoFrame gredis缓存DoVar Conn连接对象 自动序列化GoFrame gredisDo/DoVar方法Conn连接对象自动序列化/反序列化总结
2022/06/14 Golang
MySQL索引失效十种场景与优化方案
2023/05/08 MySQL