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

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

您可以通過將選擇器的長度與<td>元素的長度進行比較來檢查第一行是否僅包含class="HD1"元素。

如果它們的長度相同（所有<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>