1、eq() 筛选指定索引号的元素
2、first()筛选出第一个匹配的元素
3、last() 筛选出最后一个匹配的元素
4、hasclass()检查匹配的元素是否含有指定的类
5、filter()筛选出与指定表达式匹配的元素集合
6、is() 检查元素是否参数里能匹配上的
7、map()
8、has()筛选出包含指定子元素的元素
9、not()排除能够被参数中匹配的元素
10、slice()从指定索引开始,截取指定个数的元素
11、children()筛选获取指定元素的资源
12、closest() 从当前元素开始,返回最先匹配到的符合条件的父元素
13、find()从指定元素中查找子元素
14、next() 获取指定元素的下一个兄弟元素
15、nextall() 获取其后的所有兄弟元素
16、nextuntil() 获取其后的元素,直到参数能匹配上的为止,不包括结束条件那个
17、offsetposition()返回第一个用于定位的祖先元素,即查找祖先元素中position为relative或absolute的元素。
18、parent() 获取指定元素的直接父元素
19、parents() 获取指定元素的所有祖先元素,一直到6c04bd5ca3fcae76e30b72ad730ca86d36cc49f0c466276486e50c850b7e4956
20、parentsuntil()获取指定元素的祖先元素,知道参数里能匹配到的为止
21、prev()获取指定元素的前一个兄弟元素
22、prevall() 获取指定元素前面的所有兄弟元素
23、prevuntil() 获取指定元素前面的所有兄弟元素,直到参数里的条件能够匹配到的。 注意参数条件本身不会被匹配
24、siblings() 获取指定元素的兄弟元素,不分前后
25、add()将选中的元素添加到jquery对象集合中
26、andself()将自身加到选中的jquery集合中,以方便一次性操作
27、end() 将改变当前选择器选中的操作回退为上一个状态。
28、contents未明白
************************* 筛选 ************************************
一、eq()筛选指定索引号的元素
语法:eq(index|-index)索引号从0开始,若为负值,则从最后一个开始倒数,最后一个从-1开始
$("p").eq(1);//如果选择器改为 $("p").eq(-1),则我是第四个p会被选中
<div>
<p>我是第一个p</p>
<p>我是第二个p</p>//会被选中,索引值为1
<p>我是第三个p</p>
<p>我是第四个p</p>
</div>
二、first()筛选出第一个匹配的元素
语法:first()此方法没有参数
$("p").first();
<div>
<p>我是第一个p</p>//我的索引值是0,我是第一个,我会被选中
<p>我是第二个p</p>
<p>我是第三个p</p>
<p>我是第四个p</p>
</div>
三、last()筛选出最后一个匹配的元素
语法:last()此方法没有参数
$("p").last();
<div>
<p>我是第一个p</p>
<p>我是第二个p</p>
<p>我是第三个p</p>
<p>我是第四个p</p> //我是最后一个,我会被选中
</div>
四、hasclass()检查匹配的元素是否含有指定的类
语法:hasclass(class)class为类别名//返回布尔值
if($("p").hasclass("p2"))
{
alert("我里面含有class=p2的元素");//会弹出,p里的确存在class="p2"的元素
}
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p>
<p>我是第三个p</p>
<p>我是第四个p</p>
</div>
五、filter()筛选出与指定表达式匹配的元素集合
语法:filter(expr|obj|ele|fn)expr:匹配表达式|obj:jquery对象,用于匹配现有元素 | dom:用于匹配的dom元素 | function返回值作为匹配条件
$("p").filter(".p2");
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p>//我会被选中,我的class="p2"
<p>我是第三个p</p>
<p>我是第四个p</p>
</div>
六、is()检查元素是否参数里能匹配上的
语法:is(expr|obj|ele|fn)expr:匹配表达式|obj:jquery对象,用于匹配现有元素 | dom:用于匹配的dom元素 | function返回值作为匹配条件
$($("p").first().is(".p2"))
{
alert("不会弹出,因为第一个p的class不等于p2");
}
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p>//我会被选中,我的class="p2"
<p>我是第三个p</p>
<p>我是第四个p</p>
</div>
七、map()
八、has()筛选出包含指定子元素的元素
语法:has(expr|ele)expr:选择表达式 | dom元素选择
$("div").has("p");
<div> //本div会被选中,因为该div含有p子元素
<p>我是第一个p</p>
<p class="p2">我是第二个p</p>
<p>我是第三个p</p>
<p>我是第四个p</p>
</div>
<div>
<span>我是一个span</spam>
</div>
九、not()排除能够被参数中匹配的元素
语法:not(expr|ele|fn)expr:选择表达式 | dom元素选择 | fn的作用还不清楚
$("p").not(".p2");
<div>
<p>我是第一个p</p>//会被选中,没有class=p2
<p class="p2">我是第二个p</p> //不会被选中,因为有class=p2被not(".p2")排除了
<p>我是第三个p</p>//会被选中,没有class=p2
<p>我是第四个p</p> //会被选中,没有class=p2
</div>
十、slice()从指定索引开始,截取指定个数的元素
语法:slice(start, [end]) start位置, end可选,结束位置,不包含结束位置那个。如果不指定,则匹配到最后一个。
$("p").slice(1,3)
<div>
<p>我是第一个p</p>//不会被选中,我索引为0
<p class="p2">我是第二个p</p> //会被选中,我索引为1
<p>我是第三个p</p>//会被选中,我索引为2
<p>我是第四个p</p> //不会被选中,虽然我的索引为3,但是不包括我
</div>
********************** 筛选 *********************************
十一、children()筛选获取指定元素的资源
语法:children(expr);获取指定元素的资源,expr为子元素筛选条件
$("div").children(".p2");
<div>
<p>我是第一个p</p>//不会被选中,虽然我是div的子元素,但是我没class=p2
<p class="p2">我是第二个p</p> //会被选中,我既是p的子元素,又有class=p2
<p>我是第三个p</p>//不会被选中,虽然我是div的子元素,但是我没class=p2
<p>我是第四个p</p> //不会被选中,虽然我是div的子元素,但是我没class=p2
</div>
十二、closest()从当前元素开始,返回最先匹配到的符合条件的父元素
$("span").closest("p","div");
<div> //不会被选中,被p抢了先机
<p>我是第一个p//p会被选中,因为p符合条件,而且是最先匹配到的,虽然div也符合条件了,但是div不是最先匹配到的。因此div不会被选中。
<span>我是p里的span</span>
</p>
</div>
十三、find()从指定元素中查找子元素
语法:find(expr|obj|ele)expr:匹配表达式 | obj用于匹配的jquery对象 | dom元素
$("div").find(".p2");
<div>
<p>我是第一个p</p>//不会被选中,虽然我是div的子元素,但是我没class=p2
<p class="p2">我是第二个p</p> //会被选中,我既是p的子元素,又有class=p2
<p>我是第三个p</p>//不会被选中,虽然我是div的子元素,但是我没class=p2
<p>我是第四个p</p> //不会被选中,虽然我是div的子元素,但是我没class=p2
</div>
十四、next()获取指定元素的下一个兄弟元素
语法:next(expr)expr:可选,筛选条件,如果下一个兄弟元素不符合改条件,则返回空。
$(".p2").next();//如果筛选改为$(".p2").next(".p4")那选中的是哪个呢?答案是:没选中任何元素,因为虽然有个class=p4的p,但它不是.p2的下一个。
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p>
<p>我是第三个p</p>//我是.p2的next
<p class="p4">我是第四个p</p>
</div>
十五、nextall() 获取其后的所有兄弟元素
语法:nextall(expr)expr:可选,筛选条件,获取其后符合expr条件的所有兄弟元素
$(".p2").nextall();//如果筛选条件改为 $(".p2").nextall(".p4");则只有我是第四个p会被选中
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p>
<p>我是第三个p</p>//会被选中,是.p2后面的兄弟元素
<p class="p4">我是第四个p</p> //会被选中,是.p2后面的兄弟元素
</div>
十六、nextuntil()获取其后的元素,直到参数能匹配上的为止,不包括结束条件那个
语法:nextuntil([expr|ele][,fil])expr筛选表达式 | dom元素筛选,注意不包括参数里的那一个
$(".p2").nextuntil(".p4");//注意此方法并不会包括.p4
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p>
<p>我是第三个p</p>//会被选中,是.p2后面的兄弟元素
<p class="p4">我是第四个p</p> //不会被选中,我作为结束条件,但不包括我
</div>
十七、offsetposition()返回第一个用于定位的祖先元素,即查找祖先元素中position为relative或absolute的元素。
语法:offsetposition()此方法没有参数由于css的绝对定位的定位基准是相对最近的一个已定位元素,因此此方法的作用不言而喻。
$("span").offsetparent();
<div style="position:relative">//选中的是div,因此div是已定位元素。
<p>
<span>我是一个span</span>
</p>
</div>
十八、parent()获取指定元素的直接父元素
语法:parent(expr)expr为筛选条件,如果直接父元素不符合条件,则不返回任何元素(无论它的祖先是否具有能与expr匹配的)
$("span").parent();
<div style="position:relative">
<p>//我是span的直接父元素,我会被匹配到
<span>我是一个span</span>
</p>
</div>
十九、parents() 获取指定元素的所有祖先元素,一直到<body></body>
语法:parents(expr)expr为筛选条件,如果某个祖先元素不符合expr则排除
$("span").parents();
<div style="position:relative">//我是span的祖先元素,我也会被匹配到.另外<body></body>也会被匹配到
<p>//我是span的直接父元素,我会被匹配到
<span>我是一个span</span>
</p>
</div>
二十、parentsuntil()获取指定元素的祖先元素,知道参数里能匹配到的为止
语法:parentsuntil(expr)expr为停止参数,一直匹配到expr为止,同时参数的条件是不会被匹配中的。
$("span").parentsuntil("div");
<div style="position:relative">//我是span的祖先元素,但是我作为停止条件,我也不会被选中
<p>//我是span的直接父元素,我会被选中
<span>我是一个span</span>
</p>
</div>
二十一、prev()获取指定元素的前一个兄弟元素
语法:prev(expr)expr:可选。当上一个兄弟元素不符合参数中的条件时,不返回任何元素。
$(".p2").prev();
<div>
<p>我是第一个p</p>//我会被选中,我是.p2的前一个元素。
<p class="p2">我是第二个p</p>
<p>我是第三个p</p>
<p class="p4">我是第四个p</p>
</div>
二十二、prevall()获取指定元素前面的所有兄弟元素
语法:prevall(expr)expr:可选,排除所有不能够被expr匹配上的元素
$(".p4").prevall(".p2");
<div>
<p>我是第一个p</p>//不会被选中,虽然我是.p4前面的兄弟元素,但是我没有class=p2
<p class="p2">我是第二个p</p> //会被选中,我既是.p4前面的兄弟元素,而且我有class=p2
<p>我是第三个p</p>//不会被选中,虽然我是.p4前面的兄弟元素,但是我没有class=p2
<p class="p4">我是第四个p</p>
</div>
二十三、prevuntil()获取指定元素前面的所有兄弟元素,直到参数里的条件能够匹配到的。 注意参数条件本身不会被匹配
语法:prevuntil([expr|ele][,fil])expr匹配表达式 | dom元素匹配
$(".p4").prevuntil(".p2");
<div>
<p>我是第一个p</p>//不会被选中,到p2就停止了
<p class="p2">我是第二个p</p> //不会被选中,我是停止条件,不包括我
<p>我是第三个p</p>//会被选中,我在.p2前,递归到我在到.p2
<p class="p4">我是第四个p</p> //不会被选中,我自己怎么可能是我自己前面的呢?
</div>
/******************** 串联 *******************************/
二十四、siblings()获取指定元素的兄弟元素,不分前后
语法:siblings(expr);expr为筛选条件,不符合条件的不会选中
$(".p2").siblings();
<div>
<p>我是第一个p</p>//会被选中,我是.p2的兄弟元素
<p class="p2">我是第二个p</p> //不会被选中,我是自己
<p>我是第三个p</p>//会被选中,我是.p2的兄弟元素
<p class="p4">我是第四个p</p> //会被选中,我是.p2的兄弟元素
</div>
二十五、add()将选中的元素添加到jquery对象集合中
add(expr|elements|html|jqueryobject)expr:选择器表达式 | dom表达式 | html片段 | jquery对象,将jquery对象集合一起方便操作;
$(".p2").add("span").css("background-color","red");
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p> //会变红
<p>我是第三个p</p>
<p class="p4">我是第四个p</p>
</div>
<span>我是一个span</span>//会变红
二十六、andself()将自身加到选中的jquery集合中,以方便一次性操作
andself()此方法无参数
$(".p2").nextall().andself().css("background-color","red");
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p> //会变红,这就是andself()的效果
<p>我是第三个p</p>//会变红
<p class="p4">我是第四个p</p> //会变红
</div>
二十七、end() 将改变当前选择器选中的操作回退为上一个状态。
end() 此方法没有参数
$(".p2").next().end().css("background-color","red");
<div>
<p>我是第一个p</p>
<p class="p2">我是第二个p</p> //会变红,这就end()的效果
<p>我是第三个p</p>//不会变红,尽管next()方法之后选中的是这一个,但是由于被end()方法回退了因此是上一个。
<p class="p4">我是第四个p</p>
</div>