<!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. 单元测试（junit使用）

    1.测试的对象是一个类中的方法. 2.导入jar包. 3.单元测试方法时候,测试方法命名规则为 public void 方法名(){},注意:测试类不能命名为public class Test{},T ...

  2. SG函数模板

    这篇虽然是转载的,但代码和原文还是有出入,我认为我的代码更好些. 转载自:http://www.cnblogs.com/frog112111/p/3199780.html 最新sg模板: //MAXN ...

  3. HDU 3555 Bomb 数位DP 入门

    给出n,问所有[0,n]区间内的数中,不含有49的数的个数 数位dp,记忆化搜索 dfs(int pos,bool pre,bool flag,bool e) pos:当前要枚举的位置 pre:当前要 ...

  4. poj_2421_mst

    D - Constructing Roads Time Limit:2000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I ...

  5. Java爬虫搜索原理实现

    permike 原文 Java爬虫搜索原理实现 没事做,又研究了一下爬虫搜索,两三天时间总算是把原理闹的差不多了,基本实现了爬虫搜索的原理,本次实现还是俩程序,分别是按广度优先和深度优先完成的,广度优 ...

  6. android:gravity 和 android:layout_Gravity属性

    LinearLayout有两个非常相似的属性: android:gravity 与android:layout_gravity. 他们的区别在于: android:gravity 属性是对该view中 ...

  7. JAVA 处理程序异常,(try、catch、finally)，(thorws)

    一.try语句: try{//这里写可能出现异常的程序} catch(Exception e){//这里写如果出现异常怎么处理的程序} 二.throws语句 语法:函数方法()  throws Exc ...

  8. PHP每日签到时怎么实现

    以淘宝网领取淘金币的签到系统为例:目标:第一天签到增加5个积分:第二天连续签到则增加8个积分:第三天连续签到,增加11个积分,第 四天连续签到,增加15个积分:第五天连续签到,增加19个积分:第六天连 ...

  9. Cassandra安装及其简单试用

    官方主页:http://cassandra.apache.org/ 简介: The Apache Cassandra Project develops a highly scalable second ...

  10. make[1]: *** [pcrecpp.lo] 错误 1

    在安装:pcre-8.30 时,报如下错误: [root@localhost pcre-8.30]# make && make installmake  all-ammake[1]: ...