jquery的常用方法 eq(), get(),size(),each(), index()

筛选器

这些都是关于序号的：

1$("p") 			所有的p
2$("p:first")  	第一个p
3$("p:last")	最后一个p
4$("p:eq(3)")	下标为3的p
5$("p:lt(3)")	下标小于3的p
6$("p:gt(3)")	下标大于3的p
7$("p:odd")		下标是奇数的p
8$("p:even")	下标是偶数的p
特别的，eq可以单独提炼为方法，可以连续打点：
1$("p").eq(3).animate({"width":400},1000);
等价于
1$("p:eq(3)").animate({"width":400},1000);
提炼出来的好处是，可以用变量
1var a = 3;
2$("p").eq(a).animate({"width":400},1000);

animate函数

动画
1$(“p”).animate({“left”:1000},2000,function(){
2 KaTeX parse error: Expected 'EOF', got '}' at position 40: …olor","red"); 3}̲); 我们骄傲的告诉大家，我们…(“选择器”).animate(终点JSON,动画时间,回调函数);
有没有缓冲呢，有，jQuery需要插件来完成，我们日后说。
jQuery默认不是匀速，是easeInOut

和我们封装的框架不一样，jQuery默认有一个处理机制，叫做动画排队。当一个元素接收到了两个animate命令之后，后面的animate会排队：
1$("p").animate("left":1000,2000);2$(“p”).animate({“top”:400},2000);
先2000毫秒横着跑，然后2000毫秒竖着跑。动画总时长4000。

如果想让元素斜着跑，就是同时变化left和top，就写在同一个JSON里面：
1$(“p”).animate({“left”:1000,“top”:400},2000);

不同的元素，不排队，是同时的。

eq()方法

1<div class="box1">
2		<p></p>
3		<p class="teshu"></p>
4		<p class="teshu"></p>
5		<p></p>
6	</div>
7	<div class="box2">
8		<p class="teshu"></p>
9		<p class="teshu">我想红！我想当明星！</p>
10		<p></p>
11		<p></p>
	</div>

现在我们想选择box2里面的1号下标的p：

$(".box2 p").eq(1)
$("p").eq(5)
$(".teshu").eq(3)
$(".box2 .teshu").eq(1)

$()函数将返回一个对象队列，用eq来精确选择这个序列中的某个元素。到底eq几是这个元素呢？仰赖$()的序列是什么。

index()方法

返回这个元素在亲兄弟中的排名，无视选择器怎么选。

1$(".teshu").click(function(){
2	alert($(this).index());
})

```javascript
1//事件监听要给box1中的所有p标签，
2$(".box1 p").click(function(){
3	//有变化的是box2中对应的p
4	$(".box2 p").eq($(this).index()).css("background-color","red");
});

each()

each()表示遍历节点，也叫作迭代符合条件的节点。
each()语句就好比派出一个侦察兵，挨家挨户去敲门，敲开门之后做什么事情，写在function(){}里面，这里面的$(this)表示敲开门的这家。

1$("p").each(function(i){
2	$(this).animate({"width":50 * i},1000);
});

size()方法和length属性

前面$()的元素页面上一共有几个，length、size()返回的都是同一个数值，就是个数。

1$("p").length
2$("p").size()

get()方法

get()方法和eq()方法基本一致，都仰赖$()的序列。
eq()返回的是jQuery对象，而get()返回的是原生JS对象。jQuery对象后面要跟着jQuery方法，原生对象后面要跟着原生属性、方法：

$("p").eq(2).html("哈哈哈哈哈哈");
//等价于：
$("p").get(2).innerHTML = "哈哈哈哈哈哈";
//等价于：
$("p").eq(2)[0].innerHTML = "哈哈哈哈哈哈";