jQuery 在jQuery中选择第N个前一个兄弟?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1022595/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Select Nth previous sibling in jQuery?
提问by Paolo Bergantino
I'm trying to set up my jQuery selector but I'm not exactly sure how I need to write it.
我正在尝试设置我的 jQuery 选择器,但我不确定我需要如何编写它。
I've got a unordered list that looks something like this:
我有一个看起来像这样的无序列表:
<ul>
<li>something</li>
<li>something</li>
<li>something</li>
<li>something</li>
<li class="last">something</li>
</ul>
Now I know if I want to select the last child I can do that by using either "ul li.last" or "ul.li:last" but say if I wanted the second from last, or third, or 20th? Now would I do that?
现在我知道如果我想选择最后一个孩子,我可以使用“ul li.last”或“ul.li:last”来做到这一点,但是说我是否想要倒数第二个,第三个,还是第 20 个?现在我会这样做吗?
回答by Paolo Bergantino
You use eq
:
你使用eq
:
$('ul li').eq(X);
Where X is a 0-based index of which element you want. You could also use the selector form:
其中 X 是您想要的元素的基于 0 的索引。您还可以使用选择器形式:
$('ul li:eq(X)');
And you could also achieve a similar result by using nth-child
:
你也可以通过使用来获得类似的结果nth-child
:
$('ul li:nth-child(X)');
The documentation has this to say about the difference between nth-child
and eq
:
该文件有这样说的区别nth-child
和eq
:
While :eq(index) matches only a single element, this matches more than one: One for each parent with index. Multiple for each parent with even, odd, or equation. The specified index is one-indexed, in contrast to :eq() which starts at zero.
虽然 :eq(index) 仅匹配一个元素,但它匹配多个元素:每个具有索引的父元素一个。每个具有偶数、奇数或等式的父级的倍数。与从零开始的 :eq() 相比,指定的索引是一索引的。
So by doing $('ul li').eq(19);
you would get the single 20th matched element of the query (so if there is more than one list in the document this won't get you "all 19th children", while $('ul li:nth-child(20)');
would get you the individual 20th matched list element of each <ul>
in the document.
因此,通过这样做,$('ul li').eq(19);
您将获得查询的第 20 个匹配元素(因此,如果文档中有多个列表,则不会获得“所有第 19 个孩子”,而$('ul li:nth-child(20)');
将获得每个第 20 个匹配的列表元素<ul>
在文件中。
EDIT:
编辑:
To do something like "second to last", the sane way to do it would be like:
要执行诸如“倒数第二”之类的操作,明智的做法是:
var $ul = $('#mylist > li');
var $el = $ul.eq($ul.length-2);
But you should probably do a check to make sure length-2 is not less than 0.
但是您可能应该进行检查以确保长度 2 不小于 0。
回答by Jeff Meatball Yang
Do you want the 3rd from last?
你想要倒数第三个吗?
var $ul = $("ul li");
$ul.find(":eq(" + Math.max(0, $ul.length - 3) + ")");
Quick explanation: The length of $ul (which is a jQuery object) is how many li's are found. So you can use that along with the ":eq(n)" selector to get the li at the desired index.
快速解释:$ul(它是一个 jQuery 对象)的长度是找到了多少个 li。因此,您可以将它与 ":eq(n)" 选择器一起使用以获取所需索引处的 li。
I used Math.max in case the list was too short (less than 3 li's).
我使用 Math.max 以防列表太短(少于 3 里)。
This will also work, but it's obviously not the best way:
这也可以,但显然不是最好的方法:
var $ul = $("ul li:last").prev().prev();
回答by Magnus
The jQuery team added this feature in version 1.9
jQuery 团队在 1.9 版本中添加了此功能
You can read about it at http://api.jquery.com/nth-last-child-selector/
回答by chaos
回答by karim79
alert($('ul li').eq(3).text());
That will alert the text of the third list item.
这将提醒第三个列表项的文本。