jquery筛选条件eq,find,paren,prev,end

eq(index|-index)

概述

获取第N个元素

参数

index

一个整数,指示元素基于0的位置,这个元素的位置是从0算起。

获取匹配的第二个元素

-index

一个整数,指示元素的位置,从集合中的最后一个元素开始倒数。(1算起)

HTML 代码:
<p> This is just a test.</p> <p> So is this</p>
jQuery 代码:
$("p").eq(1)
结果:
[ <p> So is this</p> ]



参数-index描述:

 

获取匹配的第二个元素

HTML 代码:
<p> This is just a test.</p> <p> So is this</p>
jQuery 代码:
$("p").eq(-2)
结果:
[ <p> This is just a test.</p> ]


find(expr|obj|ele)

概述

<<<<<<<<<<<<<<<----------->>>>>>>>>>>>>>>>

搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。

<<<<<<<<<<<<<<<----------->>>>>>>>>>>>>>>>

所有搜索都依靠jQuery表达式来完成。这个表达式可以使用CSS1-3的选择器语法来写。

参数

expr

用于查找的表达式

jQuery object

一个用于匹配元素的jQuery对象

element

一个DOM元素

示例

描述:

《《《《《《《《《《搜索后代元素非常好》》》》》》》》》》》》》

从所有的段落开始,进一步搜索下面的span元素。与$("p span")相同。

HTML 代码:
<p><span>Hello</span>, how are you?</p>
jQuery 代码:
$("p").find("span")
结果:
[ <span>Hello</span> ]
 

parent([expr])

概述

取得一个包含着所有匹配元素的唯一父元素的元素集合。

你可以使用可选的表达式来筛选。

参数

expr

用来筛选的表达式

示例

描述:

查找每个段落的父元素

HTML 代码:
<div><p>Hello</p><p>Hello</p></div>
jQuery 代码:
$("p").parent()
结果:
[ <div><p>Hello</p><p>Hello</p></div>]

描述:

查找段落的父元素中每个类名为selected的父元素。

HTML 代码:
<div><p>Hello</p></div><div class="selected"><p>Hello Again</p></div>
jQuery 代码:

<<<<<<<<<<<<<----------->>>>>>>>>>>>>>

$("p").parent(".selected")

结果:
[ <div class="selected"><p>Hello Again</p></div> ]

 

prev([expr])

概述

取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。

可以用一个可选的表达式进行筛选。只有紧邻的同辈元素会被匹配到,而不是前面所有的同辈元素。

参数

expr

用于筛选前一个同辈元素的表达式

示例

描述:

找到每个段落紧邻的前一个同辈元素。

HTML 代码:
<p>Hello</p><div><span>Hello Again</span></div><p>And Again</p>
jQuery 代码:
$("p").prev()
结果:
[ <div><span>Hello Again</span></div> ]

描述:

找到每个段落紧邻的前一个同辈元素中类名为selected的元素。

HTML 代码:
<div><span>Hello</span></div><p class="selected">Hello Again</p><p>And Again</p>
jQuery 代码:
$("p").prev(".selected")
结果:
[ <p class="selected">Hello Again</p> ]
 

end()

概述

回到最近的一个"破坏性"操作之前。即,将匹配的元素列表变为前一次的状态。

如果之前没有破坏性操作,则返回一个空集。所谓的"破坏性"就是指任何改变所匹配的jQuery元素的操作。这包括在 Traversing 中任何返回一个jQuery对象的函数--‘add‘, ‘andSelf‘, ‘children‘, ‘filter‘, ‘find‘, ‘map‘, ‘next‘, ‘nextAll‘, ‘not‘, ‘parent‘, ‘parents‘, ‘prev‘, ‘prevAll‘, ‘siblings‘ and ‘slice‘--再加上 Manipulation 中的 ‘clone‘。

示例

描述:

选取所有的p元素,查找并选取span子元素,然后再回过来选取p元素

HTML 代码:
<p><span>Hello</span>,how are you?</p>
jQuery 代码:
$("p").find("span").end()
结果:
[ <p><span>Hello</span> how are you?</p> ]


郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。