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 相关文章推荐
扩展jQuery 键盘事件的几个基本方法
Oct 30 Javascript
JQuery控制div外点击隐藏而div内点击不会隐藏的方法
Jan 13 Javascript
Jquery on方法绑定事件后执行多次的解决方法
Jun 02 Javascript
JavaScript 字符串常用操作小结(非常实用)
Nov 30 Javascript
Vue.JS入门教程之处理表单
Dec 01 Javascript
bootstrap模态框跳转到当前模板页面 框消失了而背景存在问题的解决方法
Nov 30 Javascript
ES6教程之for循环和Map,Set用法分析
Apr 10 Javascript
手写简单的jQuery雪花飘落效果实例
Apr 22 jQuery
laydate如何根据开始时间或者结束时间限制范围
Nov 15 Javascript
JS实现的获取银行卡号归属地及银行卡类型操作示例
Jan 08 Javascript
Vue递归组件+Vuex开发树形组件Tree--递归组件的简单实现
Apr 01 Javascript
详解如何在vue+element-ui的项目中封装dialog组件
Dec 11 Vue.js
使用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 截取字符串函数整理(支持gb2312和utf-8)
2010/02/16 PHP
在PHP中设置、使用、删除Cookie的解决方法
2013/05/06 PHP
PHP设计模式之工厂方法设计模式实例分析
2018/04/25 PHP
URL编码转换,escape() encodeURI() encodeURIComponent()
2006/12/27 Javascript
ASP中进行HTML数据及JS数据编码函数
2009/11/11 Javascript
改进UCHOME的记录发布,增强可访问性用户体验
2011/01/17 Javascript
js如何获取file控件的完整路径具体实现代码
2013/05/15 Javascript
D3.js 从P元素的创建开始(显示可加载数据)
2014/10/30 Javascript
js动态切换图片的方法
2015/01/20 Javascript
JavaScript数据结构和算法之二叉树详解
2015/02/11 Javascript
javascript实现回到顶部特效
2015/05/06 Javascript
深入解读JavaScript中的Iterator和for-of循环
2015/07/28 Javascript
JavaScript 对象字面量讲解
2016/06/06 Javascript
使用JQuery中的trim()方法去掉前后空格
2016/09/16 Javascript
浅谈js对象属性 通过点(.) 和方括号([]) 的不同之处
2016/10/29 Javascript
实现easyui的datagrid导出为excel的示例代码
2016/11/10 Javascript
JQueryEasyUI之DataGrid数据显示
2016/11/23 Javascript
vue的无缝滚动组件vue-seamless-scroll实例
2017/12/18 Javascript
nodejs简单读写excel内容的方法示例
2018/03/16 NodeJs
vue element中axios下载文件(后端Python)
2019/05/10 Javascript
利用Vue实现一个markdown编辑器实例代码
2019/05/19 Javascript
vue中$refs, $emit, $on, $once, $off的使用详解
2019/05/26 Javascript
详解element-ui中el-select的默认选择项问题
2019/08/02 Javascript
python处理文本文件并生成指定格式的文件
2014/07/31 Python
详解Python之数据序列化(json、pickle、shelve)
2017/03/30 Python
详解一种用django_cache实现分布式锁的方式
2019/09/01 Python
Vinatis德国:法国领先的葡萄酒邮购公司
2020/09/07 全球购物
几道数据库的面试题或笔试题
2014/05/31 面试题
畜牧兽医本科生个人的自我评价
2013/10/11 职场文书
社区先进事迹材料
2014/05/19 职场文书
个人纪律作风整改措施思想汇报
2014/10/12 职场文书
党员个人批评与自我批评
2014/10/14 职场文书
安全教育培训制度
2015/08/06 职场文书
严以律己学习心得体会
2016/01/13 职场文书
Python实现制作销售数据可视化看板详解
2021/11/27 Python
详解使用内网穿透工具Ngrok代理本地服务
2022/03/31 Servers