在jQuery中选择第N个兄弟姐妹?
-
06-07-2019 - |
题
我正在尝试设置我的jQuery选择器,但我不确定如何编写它。
我有一个看起来像这样的无序列表:
<ul>
<li>something</li>
<li>something</li>
<li>something</li>
<li>something</li>
<li class="last">something</li>
</ul>
现在我知道我是否想通过使用<!>“ul li.last <!>”来选择我能做到的最后一个孩子。或<!> quot; ul.li:last <!> quot;但是说如果我想要从最后,第三或第二的第二个?我现在会这样做吗?
解决方案
您使用 eq
:
$('ul li').eq(X);
其中X是您想要的元素的从0开始的索引。您还可以使用选择表:
$('ul li:eq(X)');
您还可以使用 nth-child
获得类似的结果:
$('ul li:nth-child(X)');
文档说明了$('ul li').eq(19);
和$('ul li:nth-child(20)');
:
虽然:eq(index)只匹配一个元素,但它匹配多个:每个父项都有一个索引。具有偶数,奇数或等式的每个父项的倍数。指定的索引是一个索引,与:eq()从零开始。
所以通过<ul>
你会得到查询的第20个匹配元素(所以如果文档中有多个列表,这将不会让你<!>所有19个孩子<!> ;,而<=>将为您提供文档中每个<=>的第20个匹配列表元素。
修改强>:
要执行类似<!>“;倒数第二个<!>”的操作,理所当然的方法就是:
var $ul = $('#mylist > li');
var $el = $ul.eq($ul.length-2);
但你应该检查一下,确保长度2不小于0.
其他提示
你想要最后一个?
var $ul = $("ul li");
$ul.find(":eq(" + Math.max(0, $ul.length - 3) + ")");
快速解释:$ ul(这是一个jQuery对象)的长度是找到多少个li。所以你可以将它与<!>“;:eq(n)<!>”一起使用;选择器以获得所需索引的li。
我使用Math.max,以防列表太短(少于3个li)。
这也可行,但显然不是最佳方式:
var $ul = $("ul li:last").prev().prev();
对于第三和第二十,你可以做 ul li:eq(3)
和 ul li:eq(20)
。倒数第二,您可以使用 nth-child
的 equation
参数选项,虽然我不确定。
alert($('ul li').eq(3).text());
这将提醒第三个列表项的文本。
jQuery团队在1.9版本中添加了此功能