获取 div 中最后一个 <tr> 元素的类名

Question

我有一个 table 如下所示。如您所见，第一个 <tr> 元素的 class 是 "success"，第二个 "active"，第三个是 "success"...等等。

现在我想动态地执行此操作。但是我无法获取最后一个 <tr> 元素的 class 名称来添加一些条件。

如何在 JavaScript 中执行此操作？

<div id="masterContainer" class="bs-example">
  <div  class="panel panel-default">
    <!-- Default panel contents -->
    <div class="panel-heading">User Information</div>
    <div class="panel-body">
      <p>The following table contains some personal information about users.</p>
    </div>
    <!-- Table -->
    <table class="table">
      <thead>
        <tr class="success">

          <td><b>First Name</b> <br> som</td>
        </tr>
      </thead>
      <tbody>

        <tr class="active">

          td><b>First Name</b> <br> something</td>

        </tr>

        <tr class="success">

          td><b>First Name</b> <br> something</td>
        </tr>
        <tr class="active">

          td><b>First Name</b> <br> something</td>

        </tr>

      </tbody> 
    </table>
  </div>
</div>

Answer 1

您可以使用 :last 选择器：

$('.table tr:last').attr('class');

Answer 2

querySelectorAll 方法可让您通过 CSS 选择器来查找您感兴趣的节点

var nodes = document.querySelectorAll('div tr'); // all <tr> descendants of <div>s
nodes[nodes.length - 1].className; // "active"   // the last of these

获取 div 中最后一个 <tr> 元素的类名

get classname of a last <tr> element in a div

javascript

classname