包装集

<body>

    <div id="a01">1.包装集——length</div>

    <div id="a02">2.包装集——index(obj)</div>

    <div id="a03">3.包装集——get(index)或者[index]_会由Jquery对象变成Dom对象</div>

    <div id="a04">4.包装集——add()</div>

    <a href="#">我是一个链接</a>

    <div id="a05">5.包装集——clone().appendTo</div>

    <div id="a06">6.包装集——not() [去掉]</div>

    <div id="a07">7.包装集——filter [保留]</div>

    <div id="a08">8.包装集——slice(2,4) [取中间]</div>

    <div id="a09">9.包装集——each </div>

</body>
1.包装集——length
$("#a01").click(function(){

        alert($("#a01").length);

    });
2.包装集——index(obj)
$("#a02").click(function(){

        var arrayList=$("div");

        var oneElement=$("#a01");

        alert ( arrayList.index( oneElement ) );

        //错误示范

         //alert(arrayList.index(1));//index(int)不返回对应的坐标对象

        //解释

        alert( arrayList[1] );

        alert( $(arrayList[1]) );

        //包装集包含里面的所有元素都只是DOM对象，而不是Jquery对象

        //alert( arrayList[1].text() )

        alert( $(arrayList[1]).text() )

        });
3.包装集——get(index)或者[index]_会由Jquery对象变成Dom对象
$("#a03").click(function(){

         var arrayList=$("div");

         //get[]获得的是Dom对象

         alert( arrayList[2].innerText);

         //$()Jquery对象

         alert( $(arrayList[2]).text() )

         alert( $(arrayList.get(2)).text() )

        })
4.包装集——add()
$("#a04").click(function(){

        var arrayList= $("div");

        arrayList

        .css("border","50px solid gray")

        .add("<a href='#'>123</a>").appendTo(document.body)

        .css("background","pink");

        });
5.包装集——clone().appendTo
//clone()克隆

     $("#a05").click(function(){

            $("a").clone().appendTo(document.body);

        });

6.包装集——not() [去掉]

//去掉 not

$("#a06").click(function(){

$("div").not("#a05,#a06").css("background","green");

});

7.包装集——filter [保留]

//保留

     $("#a07").click(function(){

                $("div").filter("#a05,#a06").css("background","green");

     });

8.包装集——slice(2,4) [取中间]

$("#a08").click(function(){

                $("div").slice(2,4).css("background","green");

     });

9.包装集——each

//each遍历

     $("#a09").click(function(){

                $("#a01,#a02,#a03").each(function(){

                alert($(this).text());

                });

     });

Jquery_基础(二) 包装集的更多相关文章

  1. 从零开始学习jQuery (三) 管理jQuery包装集

    本系列文章导航 从零开始学习jQuery (三) 管理jQuery包装集 一.摘要 在使用jQuery选择器获取到jQuery包装集后, 我们需要对其进行操作. 本章首先讲解如何动态的创建元素, 接着 ...

  2. 从零开始学 Web 之 jQuery（八）each，多库共存，包装集，插件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  3. jQuery包装集

    jQuery包装集指的是通过$()方法返回的一个元素集,这跟一般的javascript数组有所区别, 包装集在后者的基础上还有一些初始化的函数和属性. 我们可以对二者进行一个比较: jsdiv = d ...

  4. Dom对象和jQuery包装集

    Dom对象 在传统的JavaScript开发中,我们经常都是首先获取Dom对象,比如: document.getElementById("dv1"); 我们经常使用getEleme ...

  5. 【Storm】Storm实战之频繁二项集挖掘

    一.前言 针对大叔据实时处理的入门,除了使用WordCount示例之外,还需要相对更深入点的示例来理解Storm,因此,本篇博文利用Storm实现了频繁项集挖掘的案例,以方便更好的入门Storm. 二 ...

  6. Hadoop基础-Hadoop的集群管理之服役和退役

    Hadoop基础-Hadoop的集群管理之服役和退役 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 在实际生产环境中,如果是上千万规模的集群,难免一个一个月会有那么几台服务器出点故 ...

  7. 【Storm】Storm实战之频繁二项集挖掘（附源码）

    一.前言 针对大叔据实时处理的入门,除了使用WordCount示例之外,还需要相对更深入点的示例来理解Storm,因此,本篇博文利用Storm实现了频繁项集挖掘的案例,以方便更好的入门Storm. 二 ...

  8. Java面试题总结之Java基础(二)

    Java面试题总结之Java基础(二) 1.写clone()方法时,通常都有一行代码,是什么? 答:super.clone(),他负责产生正确大小的空间,并逐位复制. 2.GC 是什么? 为什么要有G ...

  9. jQuery学习笔记(3)-操作jQuery包装集的函数

    一.前言 在使用jQuery选择器获取到jQuery包装集后,我们就要对这些包装集进行各种操作 二.创建新的元素 1.使用HTMLDOM创建元素 (1)什么是DOM 当网页被加载时,浏览器会创建页面的 ...

随机推荐

  1. Eclipse中Spring插件的安装

    java中为了方便学习使用SSH框架,框架插件的安装是非常必要的. 本博文记录了自己安装Spring插件的过程: 本机环境:win8 64bit eclipse版本:4.5.2 MARS 插件版本:S ...

  2. Android项目实战（三十六）：给背景加上阴影效果

    圆角背景大家应该经常用: 一个drawable资源文件  里面控制corner圆角 和solid填充色 <shape xmlns:android="http://schemas.and ...

  3. linhaifeng

    http://www.cnblogs.com/linhaifeng/p/7278389.html http://blog.51cto.com/egon09

  4. loadrunner设置分压机 压力测试

    压力机设置分压机使用场景: 当本地主机内存较小,运行速度较慢,压力较大等多种需求场景下,可以使用分压机. 一.将另一台机器设置为压力机 1,开始菜单找到HP LoadRunner-->Advan ...

  5. Lvs+keepAlived实现负载均衡高可用集群（DR实现）

    第1章 LVS 简介 1.1 LVS介绍 LVS是Linux Virtual Server的简写,意为Linux虚拟服务器,是虚拟的服务器集群系统,可在UNIX/LINUX平台下实现负载均衡集群功能. ...

  6. spring-struts2-mybatis-maven 转账开发记录

          最近写一个转账需求向外提供接口,用的是spring+struts2+maven 方式,数据库是oracle.我先新建maven类,然后引入spring相关jar包和mybatis包,配置s ...

  7. 为什么epoll会那么高效

    参考(原文简直超赞):https://zhidao.baidu.com/question/687563051895364284.html下面是我结合原文写的,为了便于自己理解:关于阻塞和非阻塞的理解可 ...

  8. Run a task only once in (akka) cluster

    在stackOverflow网站上看到这一提问,下文是部分摘抄问题简述: Java cluster, run task only once We have a java process, which ...

  9. 设计模式之 - 代理模式（Proxy Pattern）

    代理模式:代理是一种常用的设计模式,其目的就是为其他对象提供一个代理以控制对某个对象的访问.代理类负责为委托类预处理消息,过滤消息并转发消息,以及进行消息被委托类执行后的后续处理.很多可以框架中都有用 ...

  10. 队列详解及java实现

    导读 栈和队列是有操作限制的线性表. 目录 1.队列的概念.特点.存储结构. 2.栈队列的java实现. 概念 队列是一种在一端进行插入,而在另一端进行删除的线性表.1.队列的插入端称为队尾:队列的删 ...