<!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. FlashBuilder(FB/eclipse) 打开多个无效

    FB也即Eclipse. 想要打开多个FB,只需要新建多个FB的快捷方式,然后在路径上面加上参数 -data "具体路径" 再打开即可. 如: "C:\Program F ...

  2. myBatis出现Mapped Statements collection already contains value for

    造成这个问题的原因很多,我遇到的主要是因为 <select id="queryCountfor****" parameterType="java.lang.Inte ...

  3. Sql Server Text 类型列 查询和更新

    Text(ntext.image)类型为大数据字段,因为存储方式不同,也决定了其查询和更新不同于一般方法. 1.表定义: 2.查询: Like查询是可用的: select * from dbo.nod ...

  4. C++学习35 模板中的函数式参数

    C++对模板类的支持比较灵活,模板类的参数中除了可以有类型参数,还可以有普通参数.例如: template<typename T, int N> class Demo{ }; N 是一个普 ...

  5. eclipse快速收缩展开代码

    快速折叠所有代码和展开所有代码都是CTRL+SHIFT+/

  6. JavaScript解耦记

    有两个页面A.B.页面A调用页面B.B页面还通过异步加载方式包含一个javascipt(例如叫:ClassHeaderEvaluation.js)文件.问题场景:A页面通过异步请求方式请求B,并在B的 ...

  7. select into from 和 insert into select 的用法和区别

    select into from 和 insert into select都是用来复制表,两者的主要区别为: select into from 要求目标表不存在,因为在插入时会自动创建.insert ...

  8. ELK+redis集群搭建

    ELK版本: logstash-1.4.2 kibana-4.0.3 redis-3.0.0 elasticsearch-1.4.4(最低版本) 分别启动命令: redis-server redis. ...

  9. ubuntu更换软件源

     ubuntu更换软件源 /etc/apt/source.list 163: deb http://mirrors.163.com/ubuntu/ trusty main restricted u ...

  10. linux内核调试指南

    linux内核调试指南 一些前言 作者前言 知识从哪里来 为什么撰写本文档 为什么需要汇编级调试 ***第一部分:基础知识*** 总纲:内核世界的陷阱 源码阅读的陷阱 代码调试的陷阱 原理理解的陷阱 ...