jQuery 如何在jQuery中选择最后一个子元素?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/4612794/
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
How to select last child element in jQuery?
提问by lovespring
How to select last child element in jQuery?
如何在jQuery中选择最后一个子元素?
Just the last child, not its descendants.
只是最后一个孩子,而不是它的后代。
回答by Yoram de Langen
You can also do this:
你也可以这样做:
<ul id="example">
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
</ul>
// possibility 1
$('#example li:last').val();
// possibility 2
$('#example').children().last()
// possibility 3
$('#example li:last-child').val();
回答by Philip
For perfomance:
对于性能:
$('#example').children().last()
or if you want a last children with a certain class as commented above.
或者,如果您想要一个具有上述特定课程的最后一个孩子。
$('#example').children('.test').last()
or a specific child element with a specific class
或具有特定类的特定子元素
$('#example').children('li.test').last()
回答by Brad Christie
By using the :last-child selector?
通过使用:last-child 选择器?
Do you have a specific scenario in mind you need assistance with?
您是否有需要帮助的特定场景?
回答by Christophe Roussy
For 2019 ...
对于 2019 年...
jQuery 3.4.0 is deprecating :first, :last, :eq, :even, :odd, :lt, :gt, and :nth. When we remove Sizzle, we'll replace it with a small wrapper around querySelectorAll, and it would be almost impossible to reimplement these selectors without a larger selector engine.
We think this trade-off is worth it. Keep in mind we will still support the positional methods, such as .first, .last, and .eq. Anything you can do with positional selectors, you can do with positional methods instead. They perform better anyway.
jQuery 3.4.0 弃用 :first、:last、:eq、:even、:odd、:lt、:gt 和 :nth。当我们移除 Sizzle 时,我们将用一个围绕 querySelectorAll 的小包装器替换它,如果没有更大的选择器引擎,几乎不可能重新实现这些选择器。
我们认为这种权衡是值得的。请记住,我们仍将支持位置方法,例如 .first、.last 和 .eq。你可以用位置选择器做的任何事情,你都可以用位置方法来做。无论如何,他们表现得更好。
https://blog.jquery.com/2019/04/10/jquery-3-4-0-released/
https://blog.jquery.com/2019/04/10/jquery-3-4-0-released/
So you should be now be using .first()
, .last()
instead (or no jQuery).
所以你现在应该使用.first()
,.last()
代替(或不使用 jQuery)。
回答by ScottyG
If you want to select the last child and need to be specific on the element type you can use the selector last-of-type
如果您想选择最后一个孩子并且需要特定于元素类型,您可以使用选择器last-of-type
Here is an example:
下面是一个例子:
$("div p:last-of-type").css("border", "3px solid red");
$("div span:last-of-type").css("border", "3px solid red");
<div id="example">
<p>This is paragraph 1</p>
<p>This is paragraph 2</p>
<span>This is paragraph 3</span>
<span>This is paragraph 4</span>
<p>This is paragraph 5</p>
</div>
In the example above both Paragraph 4 and Paragraph 5 will have a red border since Paragraph 5 is the last element of "p" type in the div and Paragraph 4 is the last "span" in the div.
在上面的例子中,第 4 段和第 5 段都将有一个红色边框,因为第 5 段是 div 中“p”类型的最后一个元素,而第 4 段是 div 中的最后一个“跨度”。
回答by subindas pm
Hi all Please try this property
大家好 请试试这个属性
$( "p span" ).last().addClass( "highlight" );
Thanks
谢谢