jquery - 使用jquery查找具有特定样式的tr标签

Question

所以我正在使用 jquery.Html 来处理这个表，对于具有单个 tr 的表，如下所示我想首先获取具有样式表的 tr 标签，一旦完成，我想获取其中特定 td 的值，如果表中有一个 tr ，我就可以这样做，如下面的 html 所示

    <table id="tblTowerSubTowerLot" class="table table-bordered table-striped mt-5">
    <thead class="thead-light">
        <tr>
            <th>Tower Name</th>
            <th>Sub Tower Name</th>
            <th>Lot Name</th>
            <th>Derived Resource</th>
            <th style="width: 75px;">Status</th>
        </tr>
    </thead>
    <tbody><tr id="trTSL0" class="pricingRow" onclick="SetLotwiseDataControls(0);" style="background-color: rgba(217, 244, 252, 1);"><td style="display:none;"><label id="lblClientFTEDetailsId0">8893</label><label id="lblDealId0">6804</label><label id="lblTowerId0">1</label><label id="lblSubTowerId0">1</label><label id="lblLotId0">1</label></td><td><label id="lblTowerName0" class="pricingRow m-0">T1</label></td><td><label id="lblSubTowerName0" class="pricingRow m-0">ST1</label></td><td><label id="lblLotName0" class="pricingRow m-0">1</label></td><td><label id="lblDerivedFTE0" class="pricingRow m-0">1.04</label></td><td><img id="imgStaffIndicator0" src="../Content/Custom/images/Staffing_tick.png" data-toggle="tooltip" title="Staffing Completed" style="width: 22px;"><img id="imgPriceIndicator0" src="../Content/Custom/images/Pricing_untick.png" data-toggle="tooltip" title="Pricing Pending" style="width: 22px;"></td></tr></tbody>
</table>

为此，我可以通过

获取特定 td 标记的值

if( $('#tblTowerSubTowerLotPricing tbody tr').attr('style') ) 
  {

    $("td label:eq(3)").html();

  } 
else 
  {

    console.log('It did not equal block');

  }

相同的图像是

但是现在当表中有多个 tr 并且选择第三个或第四个 tr 时，如下图所示

我尝试使用代码

if( $('#tblTowerSubTowerLotPricing tbody tr').attr('style') ) 
  {

    $("td label:eq(3)").html();

  } 
else 
  {

    console.log('It did not equal block');

  }

然后它进入其他部分，我无法获取数据。

当有多个 tr 标签且只有其中一个应用了样式时，如何获取数据。

Answer 1

在第二种情况下，您的选择器匹配多个元素，因此您应该使用 .each jQuery 方法解析每个元素。

这样做时，您想要选择该元素的子元素 td，因此您使用 .find jQuery 方法。

$('#tblTowerSubTowerLotPricing tbody tr').each(function(index, element) {
  if ($(element).attr('style') {
    console.log($(element).find("td label:eq(3)").html());
  } else {
    console.log('It did not equal block');
  }
});

这些方法的文档可能会为您提供进一步帮助。

https://api.jquery.com/each/

https://api.jquery.com/find/