`

jquery关于class的操作

阅读更多
hasClass() 方法检查被选元素是否包含指定的 class。
addClass()    向匹配的元素添加指定的类名。不会移除已存在的 class 属性,仅仅添加一个或多个 class 属性。
removeClass() 从所有匹配的元素中删除全部或者指定的类。
toggleClass() 从匹配的元素中添加或删除一个类。如果存在(不存在)就删除(添加)一个类。

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
 $("img").each(function(){    
      $(this).addClass("red blue").removeClass("blue");
 <!--css样式优先级导致addClass后显示blue属性,移除blue属性显示red属性-->
      var mes=$(this).hasClass("blue");
      alert(mes);<!--此时blue被移除返回false-->
  });      
</script>
<style type="text/css">
.red {
    border: 1px solid red;
}
.blue{
    border: 2px dotted blue;
}
</style>
<img src="http://placehold.it/350x100"  />


<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("img").each(function(){
  $(this).toggleClass("example"); <!--$(this)得到 jQuery对象-->
  });
});
</script>


http://w3cschool.cn/jquery_ref_attributes.html
分享到:
评论

相关推荐

    jQuery 1.4.1 中文参考

    ...... ........目录............................12.3 关于jQuery 1.2 版翻译 197 12.4 提交bug及获取更新 197 12.5 changelog 198 ....................................... .......................................

    JQuery对class属性的操作实现按钮开关效果

    在本文中用JQuery对class属性的操作方法实现页面中的按钮开关效果。 首先定义两个class: 代码如下: .controlOff{ display:inline-block; width:130px; height:36px; cursor:pointer; background-image:url(“../...

    JQuery教程自学笔记

    2.3.4设置或取得元素的CSS class 34 2.3.5读写HTML元素的css 属性 36 2.3.6 操作HTML元素的长宽大小 37 三、JQuery UI 39 3.1 概述 39 3.2 JQuery UI 基本工作过程 41 3.2.1初始化 41 3.2.2 方法 42 3.2.3 通用方法 ...

    jQueryAPI_CHM(1.3).CHM与语法总结

     通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换  只有...

    Jquery学习手册

    已经得到了一个jQuery对象,但是并不是想要的,那么可以通过一系列的跳转方法,比如parent()、next()、children()、find()等,或者过滤筛选的方法,比如eq()、filter()、not()等,来得到最终想要操作的jQuery对象。...

    超实用的jQuery代码段

    超实用的jQuery代码段精选近350个jQuery代码段,涵盖页面开发中绝大多数要点、技巧与方法,堪称史上最实用的jQuery代码参考书,可以视为网页设计与网站建设人员的好帮手。...11.32 使用jQuery操作DOM的限制

    JQuery教程自学笔记总结

    2.3.4设置或取得元素的CSS class 34 2.3.5读写HTML元素的css 属性 36 2.3.6 操作HTML元素的长宽大小 37 三、JQuery UI 39 3.1 概述 39 3.2 JQuery UI 基本工作过程 41 3.2.1初始化 41 3.2.2 方法 42 3.2.3 ...

    jquery插件使用方法大全

    ·attribute(改进了.attr()的性能)、jQuery()核心函数、CSS(.css()性能有两倍提升)、特效和事件、DOM操作等也有显著改进 1.5 美国时间1月31日John Resig在jQuery官方博客发表文章,宣布jQuery 1.5正式版已经...

    JQuery教程自学笔记(最新)

    2.3.4设置或取得元素的CSS class 34 2.3.5读写HTML元素的css 属性 36 2.3.6 操作HTML元素的长宽大小 37 三、JQuery UI 39 3.1 概述 39 3.2 JQuery UI 基本工作过程 41 3.2.1初始化 41 3.2.2 方法 42 3.2.3 ...

    jQuery详细教程

    • jQuery 的 action() 执行对元素的操作 示例 $(this).hide() - 隐藏当前元素 $("p").hide() - 隐藏所有段落 $("p.test").hide() - 隐藏所有 class="test" 的段落 $("#test").hide() - 隐藏所有 id="test" 的元素 ...

    jquery.corner.js最新版本【2.9】

    操作步骤:引入jquery-1.4.2.min.js(1.3以上版本就可以了)和jquery.corner.js 在script区域写入语法【打开官方网站,在每个样式的图片上的语法,注意this代表当前对象标签,换句话说,你可以把this换成一个其他...

    最新jQuery常用技巧 超赞!

    通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换 只有jquery...

    jQuery Dom元素操作技巧

    Dom是Document Object Model的缩写,意思是文档对象模型。DOM是一种与浏览器、平台、语言无关的接口,使用该接口可以轻松...③$(#test1).append('&lt;div class=error_info&gt;&lt;span class=Validform_checktip&gt;&lt;/span&gt;&lt;/

    jQuery核心语法

    通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换 只有jquery...

    jquery技巧总结

    通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换 只有jquery...

    jQuery仿微信公众号自定义菜单界面操作代码.zip

    jQuery仿微信公众号自定义菜单界面操作代码&lt;/title&gt; &lt;link rel="stylesheet" href="assets/css/bootstrap.min.css?3.1.64"&gt; &lt;link rel="stylesheet" href="assets/css/font-awesome.min.css?3.1.64...

Global site tag (gtag.js) - Google Analytics