jQuery 第三课 —— 识包装集

前言：

1.什么是 jQuery 包装集？

　　包装集就是通过 选择定位对象，

　　定位到多个对象的集合就叫包装集

2.如果技巧的认识包装集？　　

　　比喻成一个数组，对象数组，

　　网页中定位到的多个对象组合成的一个数组

3.本章目标：了解认识包装集中常用的方法

---

 

内容：

实例：

　　 <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>

1.定位包装集

$("div")

//标签名为 div 的包装集

2.获取包装集的长度

length;

$("div").length;

//获取包装集的长度

3.定位包装集中某个对象的下标

index(Obj)

$("div").index( $("#a03") )

//获取包装集中 id 为 #a03 对象在包装集中的下标

4.通过下标获取对应的对象

get(int)

$("div")[int]

$("div").get(0)

//获取包装集中下标为 0 的对象 

$("div")[0]

//获取包装集中下标为 0 的对象 

5.添加元素进入包装集

add(HTML).appendTo(document.body);

$("div").add("<div id='add'>我是添加的</div>").appendTo(document.body);

//在包装集中添加一个 “ <div id='add'>我是添加的</div> ”的代码到网页的body内

6.包装集的克隆方法

clone().appendTo(document.body)

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

//克隆 a 标签的所有对象到 网页的 body 中

7.包装集的去掉方法

not(Obj01,Obj02)

$("div").not("#a01,#a02");

//去除 包装集中 id 为 a01 和 a02 的对象

8.包装集的仅保留方法

filter(Obj01,Obj02)

$("div").filter("#a01,#a02");

//仅保留包装集中id 为 a01 和 a02 的对象

9.包装集的取中间方法

slice(start,end)

$("div").slice(2,3)

//填入下标，包头不包后，定位到的是包装集中下标为 2 的对象

10.包装集中的遍历方法

each()

$("div").each(function(){
   alert( $(this).html() ); 
})

//含义，遍历div这个包装集，输出所有对象的 html 代码

---

 

总结：

　　包装集的运用在网页之后还是比较广泛的

　　所以熟悉它的一些常用的方法也是必不可少的

　　多练，多敲，就可以灵活运用