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

分为以下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")
}
});

注：以上代码可以实现点击切换背景颜色。

赞 (0)

相关推荐

  • jQuery检测某个元素是否存在代码分享

    代码中可能有这样的情况,根据元素是否存在来执行不同的操作,这样就需要判断指定的元素是否存在. 使用$(selector)可以获得匹配元素集合,而匹配元素集合的length属性可以获得集合中匹配元素的个数,所以只要判断length属性值是否为零,就可以判断元素是否存在.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>我们</title&

  • jQuery 选择同时包含两个class的元素的实现方法

    jQuery 选择同时包含两个class的元素的实现方法 <element class="a b"> 1. 交集选择: $(".a.b")--选择同时包含a和b的元素. 2. 并集选择:$(".a, .b")--选择包含a或者包含b的元素. 以上这篇jQuery 选择同时包含两个class的元素的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • jQuery判断数组是否包含了指定的元素

    要判断数组中是否包含某个元素,从原理来来说,就是遍历整个数组,然后判断是否相等, 复制代码 代码如下: var arr = [ "xml", "html", "css", "js" ]; $.inArray("js", arr);  //返回 3, 如果不包含在数组中,则返回 -1; 以上就是本文的全部内容了,有需要的小伙伴参考下吧

  • jQuery 判断页面元素是否存在的代码

    例如: 复制代码 代码如下: document.getElementById("someID").innerText("hi"); 如果ID为"someID"的元素不存在,我们将得到Javascript运行错误:document.getElementById("someID") is null 正确的写法应该是: 复制代码 代码如下: obj = document.getElementById("someID&quo

  • jquery判断元素的子元素是否存在的示例代码

    jquery判断子元素是否存在 一.判断子元素是否存在   //一级子元素 if($("#specialId>img").length==0)     if ($( "#specialId:has(img)" ).length==0)          {      //-----没有img子标记-----     }    else     {      //-------有img子标记------     } 二.选择特定id元素下的特定id子元素   

  • jquery中获取元素里某一特定子元素的代码

    之前做的一些JQUERY应用都是些很基础的编程,对于选择器要求不高,像类似于"$('.class')"."$('#id')"."$('#id>.class')"."$(this)"."$(this).parent()"."$(this).children()"这些简单的语句都能解决的. 问题的出现是我要选择一个ul里某个的li中的一个span,因为要利于编程,li是用 $('ul&

  • jQuery判断元素是否存在的可靠方法

    最简单的办法是判断元素匹配长度 譬如HTML代码: 复制代码 代码如下: <div class='mydiv'></div> 通常我们的做法是 复制代码 代码如下: if($('.mydiv').length>0) 比较可靠且不会出错的做法是: 复制代码 代码如下: if($('.mydiv').length && $('.mydiv').length>0)  return true; 使用传统javascript方法,如下: 复制代码 代码如下: if

  • 使用jquery判断一个元素是否含有一个指定的类(class)实例

    在jquery中可以使用2种方法来判断一个元素是否包含一个确定的类(class).两种方法有着相同的功能. 2 种方法如下: 1. is('.classname') 2. hasClass('classname') 以下是一个div元素是否包含一个redColor的例子: 1. 使用is('.classname')的方法 $('div').is('.redColor') 2. 使用hasClass('classname')的方法(注意jquery的低版本可能是hasClass('.classna

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

    分为以下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 = $

  • jQuery中判断一个元素是否为另一个元素的子元素(或者其本身)

    上个月研究学习了<js判断一个元素是否为另一个元素的子元素>,感觉还挺好用,但是在jQuery应用中还是有很多缺陷,比如多个元素的时候写起来就不是很方便.所以写了比较简单的jQuery判断一个元素是否为另一个元素的子元素(或者其本身)的两个扩展: 复制代码 代码如下: //判断:当前元素是否是被筛选元素的子元素 jQuery.fn.isChildOf = function(b){ return (this.parents(b).length > 0); }; //判断:当前元素是否是被筛

  • JQuery中判断一个元素下面是否有内容或者有某个标签的判断代码

    一.判断文本是否为空 复制代码 代码如下: var jqObj = $(this); if(jqObj.text().trim()){ //trim()方法是去空格,$.trim()函数删除提供字符串的所有换行符,空格(包括非中断空格),开始和结束tab.如果这些空白字符在字符串中间发生时,它们将被保留. jqObj.hide(); } 二.判断这个标签下是否有某个已知的元素,比如判断ul标签下是否有li元素 复制代码 代码如下: var jqObj = $(this); if(!jqObj.h

  • jQuery函数的第二个参数获取指定上下文中的DOM元素

    jQuery函数的第二个参数可以指定DOM元素的搜索范围. 第二个参数可分为以下类型 DOM reference jQuery wrapper document 代码示例 复制代码 代码如下: <!DOCTYPE html> <html> <body> <form> <input name="" type="checkbox"/> <input name="" type="

  • jQuery经过一段时间自动隐藏指定元素的方法

    本文实例讲述了jQuery经过一段时间自动隐藏指定元素的方法.分享给大家供大家参考.具体如下: 下面的代码提供了两种方法用于定时隐藏元素,第一种是使用setTimeout实现,第二种是使用jQuery1.4以后版本中提供的delay方法实现,第二种更简单一下. //这是1.3.2中我们使用setTimeout来实现的方式 //http://www.jb51.net setTimeout(function() { $('.showdiv').hide('blind', {}, 500) }, 50

  • jQuery判断一个元素是否可见的方法

    本文实例讲述了jQuery判断一个元素是否可见的方法.分享给大家供大家参考.具体如下: jQuery 可以很容易地确定一个元素是可见的或是隐藏的,然后分别做不同的处理.如:我想根据某 div 是否可见,在按钮上显示不同的文字和图标.可以这样实现: 方法一: $('#para_div button').click(function() { if($(this).next().is(":visible")) { //$(this).html('显示'); $(this).css({&quo

  • jQuery使用hide方法隐藏页面上指定元素的方法

    本文实例讲述了jQuery使用hide方法隐藏页面上指定元素的方法.分享给大家供大家参考.具体如下: 下面的JS代码隐藏了网页中所有<p>标签的内容 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button&qu

  • jQuery使用CSS()方法给指定元素同时设置多个样式

    本文实例讲述了jQuery使用CSS()方法给指定元素同时设置多个样式的方法.分享给大家供大家参考.具体如下: <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ $(

随机推荐