Select 第 nth-last-child 当不是每个元素都有选择 class-jquery

Question

我正在寻找类似于以下 CSS4 select 或 jQuery 的内容： :nth-last-match(selector)

我需要 select 元素列表中的 倒数第二个 元素，其中并非每个元素都有 class - 请参阅以下示例强调我希望实现的目标。

$('.select:nth-last-child(2)').addClass('selected');

.test.selected { color:red; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<div class="test">a</div>
<div class="test select">a</div>
<div class="test">a</div>
<div class="test select">a</div>
<div class="test">a</div>
<div class="test">a</div>
<div class="test select">EXPECTED SELECTION</div> //This element should be selected
<div class="test">a</div>
<div class="test select">a</div>
<div class="test">a</div>
</div>

非常感谢。

Answer 1

您可以使用 .get() 方法和 负参数 值：

var expected = $('div .select').get(-2);
$(expected).css('background', 'red');

所以，.get(-1) 是这个集合的最后一个元素，.get(-2) 是倒数第二个。
检查下面的片段

var expected = $('div .select').get(-2);
$(expected).css('background', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="test">a</div>
  <div class="test select">a</div>
  <div class="test">a</div>
  <div class="test select">a</div>
  <div class="test">a</div>
  <div class="test">a</div>
  <div class="test select">EXPECTED SELECTION</div>
  <div class="test">a</div>
  <div class="test select">a</div>
  <div class="test">a</div>
</div>

Select 第 nth-last-child 当不是每个元素都有选择 class-jquery

Select nth-last-child when not every element has the selecting class-jquery

html

javascript

jquery

jquery-selectors