Question

我正在尝试更改元素组的最后一个子节点的css，如果最后一个子节点具有特定类。

例如

<div class="box">
<div class="entry"></div>
<div class="entry"></div>
<div class="divider"></div>
<div class="entry"></div>
<div class="entry"></div>
</div>

<div class="box">
<div class="entry"></div>
<div class="entry"></div>
<div class="entry"></div>
<div class="entry"></div>
<div class="divider"></div>
</div>

<div class="box">
<div class="entry"></div>
<div class="entry"></div>
<div class="divider"></div>
<div class="entry"></div>
<div class="entry"></div>
</div>

我只想为第二个条目块更改类"divider"的css，因为它是最后一个孩子。这是我到目前为止所得到的。似乎这样可行，但唉不是：

$(".entry").each(function() {
  if($(this).is('last-child')) {
    if($(this).hasClass("divider")) {
          $(this).css("border-top-color", "green");
    }
  }
});

Answer 1

看来你只需要这个：

$('.divider:last-child').css(...);

即。更改其父级.divider的每个last-child的CSS。

不需要.each，因为.css函数会隐式地对每个匹配元素进行操作。

Answer 2

只需使用:last-child选择器：

$('.divider:last-child').css('border-top-color','green')

Answer 3

我认为您在最后一个子选择器中缺少冒号，请尝试将其更改为:last-child。

找到每个元素的最后一个孩子

3 个答案: