包装集

<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. time模块整理

    time模块中包含的方法 time() -- 返回当前系统的时间戳clock() -- 在UNIX系统上,它返回的是"进程时间",它是用秒表示的浮点数(时间戳). 而在WINDOW ...

  2. 百度地图点集文档使用python的re模块处理成json的相关写法

    这个实在不好起名字.写这个还不是因为被渣度坑的不要不要的.为什么说他坑呢.参考一下这两个截图的txt文档: 文档资源下载地址:  http://lbsyun.baidu.com/index.php?t ...

  3. java 正则学习

    前言 在网上找了许多关于正则解析 URL,结果不是很满意,所以自己学习正则: java url 那么解析 url 的代码如下: import java.util.regex.Matcher; impo ...

  4. SQLMap安装步骤

    SQLMap是利用Python语言写的,所以需要将Python这个语言环境给安装上 : 1.首先下载Python(这里Python版本为2.7.2,可以下载不同或高版本的) 2.然后在下载sqlmap ...

  5. Android 开发，你遇上 Emoji 头疼吗？

    在 Android 中,如果需要使用的到 Emoji 表情,你会发现在某些设备上,有一些 Emoji 表情会被以豆腐块 "☐" 的形式显示,这是因为当前设备并不支持这个 Emoji ...

  6. C#创建对象时各种初始化属性、字段的方式的执行顺序

    创建对象代码如下: new FilterInfo(Student.CreateTimeProperty,"朱七",Express.Equals,Relationship.Or) { ...

  7. 栈和队列数据结构的相互实现[LeetCode]

    栈是先进后出,队列是先进后出,这里讨论一下两种数据结构之间的相互实现. 一.用两个栈实现队列 我们用一个栈来实现队列的进队操作(栈A),用另一个栈来实现队列的出队操作(栈B). 1.入队列: 把元素放 ...

  8. find + xargs + cp 遇到文件名中带空格如何处理

    一,需求为查询文件名为ZRSH开头的时间为7月至今的所有文件并打包 1.首先想到的就是find + xargs + cp  格式.. find 2016073* -type f  -name *ZRS ...

  9. Java 浅析Thread.join()

    概要 本文分为三部分对 Thread.join() 进行分析: 1. join() 的示例和作用 2. join() 源码分析 3. 对网上其他分析 join() 的文章提出疑问 1. join() ...

  10. NumPy学习笔记 二

    NumPy学习笔记 二 <NumPy学习笔记>系列将记录学习NumPy过程中的动手笔记,前期的参考书是<Python数据分析基础教程 NumPy学习指南>第二版.<数学分 ...