<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>wrap</title>

     <script type="text/javascript" src="../jquery/jquery-1.11.3.min.js"></script>

     <style type="text/css">

         .lianjie{display: inline-block;border:1px solid red}

         .border{border:1px solid red}

         .border1{outline: 4px dotted green }

     </style>

 </head>

 <body>

 <a href="http://www.baidu.com" class="baidu">百度</a>

 <a href="http://www.souhu.com" class="souhu">百度</a>

 <a href="http://www.xinlang.com" class="xinlng">百度</a>

 <img src="1.jpg" alt="这是张图片"/>

 <script type="text/javascript">

     $(document).ready(function(){

         $("img").addClass("picture");//添加class属性

         $("img").removeClass("picture").addClass("t_pic");//删除并添加class属性

         console.log($("img").hasClass("t_pic"));//hasClass检测是否存在Class属性

         $("a:odd").addClass("lianjie");//odd 奇数 even偶数

         $("a").addClass(function(index,eclass){//动态添加class属性 index是索引 elcass处理当前元素拥有的class属性

             if(index%==){

                 return "even";

             }else{

                 return "odd";

             }

         });

         $("a").filter(":odd").addClass("oddClass").end()//filter()筛选出于表达式匹配的结果集 end()返回最近一次的破坏性操作之前，将匹配的元素列表变为前一次状态

                 .filter(":even").addClass("evenClass");

         $("<button>toggle</button>").appendTo("body").click(doToggle);

         function doToggle(e){

 //            $("img").toggleClass("border");//toggleClass切换class

 //            $("img").toggleClass("border border1");//toggleClass切换多个class

 //            $("img").toggleClass();//toggleClass()不添加参数的话是切换全部class

 //            $("img").toggleClass("border",false);//toggleClass()第二个参数是false只删除

 //            $("img").toggleClass("border",true);//toggleClass()第二个参数是true值添加

             $("a").toggle(function(index,currentClass){

                 if(index%==){

                     return "border";

                 }else{

                     return "border1";

                 }

             });

             e.preventDefault();

         }

     });

 </script>

 </body>

 </html>

jquery 相关class属性的操作的更多相关文章

  1. js进阶 11-3 jquery中css属性如何操作

    js进阶 11-3  jquery中css属性如何操作 一.总结 一句话总结:通过css()方法 1.attr和css是有交叉的,比如width,两者中都可以设置,那么他们的区别是什么? 其实通俗一点 ...

  2. JQuery 相关用法和操作

    01-JQuery 基础语法: 1.使用JQuery必须先导入JQuery.x.x.xjs文件. 2.JQuery中的选择器: $(选择器).函数() ① $是JQuery的缩写,既可以使用JQuer ...

  3. jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax

    jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...

  4. jQuery DOM/属性/CSS操作

    jQuery DOM 操作 创建元素 只需要把DOM字符串传入$方法即可返回一个 jQuery 对象 var obj = $('<div class="test">&l ...

  5. js进阶 11-2 jquery属性如何操作

    js进阶 11-2  jquery属性如何操作 一.总结 一句话总结:jquery中的属性用attr方法表示.jquery中都是方法. 1.jquery中的属性的增删改查操作? 只需要两个方法, at ...

  6. JQuery知识快览之五—操作属性和结构

    前文提到JQuery提供了丰富的内置方法来操作对象集,本文主要介绍JQuery中的那些内置操作属性和DOM结构的方法. prop还是attr? 从JQuery1.6版开始,新增了prop方法来获取和设 ...

  7. jQuery attr removeAttr 属性操作

    jQuery attr removeAttr 属性操作 <%@ page language="java" import="java.util.*" pag ...

  8. jquery 学习(二) - 属性操作

    html代码 <div class="n1" zdy="z1">AAA <p>1111111</p> <input t ...

  9. jQuery学习之------对标签属性的操作

    jQuery学习之------标签的属性 <a href=””>链接</a>此处的href就是该a标签带有的属性 在js中对标签的属性的操作方法有 1.1getAttribut ...

随机推荐

  1. AP_应付税务预扣税Withholding Tax的设定和使用（案例）

    2014-07-13 Created By BaoXinjian

  2. ylbtech-Unitity-CS:Generics

    ylbtech-Unitity-CS:Generics 1.A,效果图返回顶部 Unsorted List: Raul:35 Alessandro:30 Maria:72 Hiroyuki:108 A ...

  3. JAVA 界面 - 记事本

    代码: import java.awt.*; import javax.swing.*; import java.awt.event.*; public class Jiemian10 extends ...

  4. xcode 插件管理工具

    每次xcode 更新后之前安装的插件 都失效了!解决办法: 一.可以通过在原插件项目infoplist新增 新xcode的 DVTPlugInCompatibilityUUID 来使之支持新版xcod ...

  5. ios6和ios7禁止屏幕旋转

    ios6和ios7禁止屏幕旋转 - (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOr ...

  6. C#里WinForm开发中如何实现控件随窗体大小的改变而自动适应其改变(转)

    在设计可供用户调整大小的窗体时,如何实现该窗体上的控件也应能正确地随窗体的改变而自动调整大小并且能重新定位?此时就要借助控件的．Anchor属性.Anchor属性定义控件的定位点位置.当控件锚定到某个 ...

  7. 配置webstorm使用supervisor时出现 /usr/bin/env: node: 没有那个文件或目录 解决方法

    配置好supervisor路径后 出现了 启动时出现了 /usr/bin/env: node: 没有那个文件或目录 需要讲.nvm下的node链接到, /usr/bin/目录下 sudo ln -s ...

  8. vb eof详解

    源地址:https://zhidao.baidu.com/question/87122186.html?qbl=relate_question_1&word=eof%20sql&ski ...

  9. eclipse项目！*图标含义

    一 .项目前面有红色!,表示工程中classpath中指向的包路径错误 解决办法: 右键项目名称 BuildPath ---> Configure Build Paht...中,然后上面有几个选 ...

  10. Java SE 第二十三讲----static关键字and final关键字

    1.static关键字 [在二十二讲视频中30分钟开始讲授] 2.static修饰属性:无论一个类生成了多少个对象,所有这些对象共同使用唯一一份静态的成员变量:一个对象对该静态成员变量进行了修改,其他 ...