如何在每行中选择具有特定类的最后一个元素

How to select in each row the last element with certain class?

本文关键字：元素 最后一个 选择      更新时间：2023-09-26

每一行中都有一些单元格包含.meow类。
如何在每行中选择最后 .meow元素?
下面的代码只是选择所有的。meows…

$("tr").each(function(){
  $(".meow").css("border", "3px solid red");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr> <td><div class="meow">Meow</div><td>
       <td>Woof</td>
       <td><div class="meow">Meow</div><td>
  </tr>
  <tr> <td> <div class="meow">Meow</div><td>
       <td><div class="meow">Meow</div></td>
       <td>Woof<td>
   </tr>
  </table>

像这样试试

$("tr").each(function(){
  $(this).find(".meow:last").css("border", "3px solid red");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr> <td><div class="meow">Meow</div><td>
       <td>Woof</td>
       <td><div class="meow">Meow</div><td>
  </tr>
  <tr> <td> <div class="meow">Meow</div><td>
       <td><div class="meow">Meow</div></td>
       <td>Woof<td>
   </tr>
  </table>

你应该使用querySelector:

document.querySelector( ".child:last-of-type" );

你也可以在元素上使用querySelector，所以在每一行上使用它。

https://jsfiddle.net/L5fdhs7d/

使用jQuery的last()函数
此外，您需要基于当前的tr进行搜索，因此使用$(this).find()。

$(this).find(".meow").last().css("border", "3px solid red");

变化

$("tr").each(function(){ $(".meow").css("border", "3px solid red"); });

$("tr").each(function(){ $(this).find(".meow:last").css("border", "3px solid red"); });

https://api.jquery.com/last-selector/

相关文章：