Question

我有一个函数，其中获取表的第一个TR，然后获取该TR的所有TD。现在，我需要修改此功能：在获取第一个TR时，我需要检查我的TR的所有TD是否都具有“ HD1”类，因此我需要获取表的第二个TR。我把我的功能放在下面。预先感谢。

 function getColumnsIdx(id) {
   var header = $("table#" + id + " thead tr:eq(1)");
   var header_fields = $("td", header);
   var header_idx = new Object();
   header_fields.each(function(idx, val) {
     var $$ = $(val);
     var key = $$.text();
     header_idx[key] = idx;
   });
 return header_idx;
}

Answer 1

您可以在没有该类的情况下寻找第一个td，然后选择其父类：

var header = $("table#" + id + " thead tr td:not(.HD1):eq(0)").parent();

但是，这可能会导致获得第三/第四/等行。如果必须始终返回第二行，即使这些单元格也都具有HD1类：

var header = $("table#" + id + " thead tr:eq(0)");
var header_fields = $("td", header);

if (header_fields.length && header_fields.length == header_fields.filter(".HD1").length) {
  header = header.next();
  header_fields = $("td", header);
}

注意：:eq()使用从零开始的索引，因此使用eq(0)选择第一个元素。

Answer 2

您可以通过将选择器的长度与一般class="HD1"元素的长度进行比较来检查第一行是否仅包含<td>元素。

如果它们的长度相同（所有<td>都是HD1），请使用第二行。否则，请使用第一个。

使用HD1：

let $row = $("thead tr:first > .HD1").length === $("thead tr:first > td").length
  ? $("table tr").eq(1)
  : $("table tr").first();
  
$row.css("color", "red");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="HD1">1</td>
    <td class="HD1">2</td>
    <td class="HD1">3</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
</table>

没有HD1：

let $row = $("thead tr:first > .HD1").length === $("thead tr:first > td").length
  ? $("table tr").eq(1)
  : $("table tr").first();
  
$row.css("color", "red");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
</table>

如何排除包含具有特定类的TD的TR

2 个答案: