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时，如果选择了第3或第4 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/

Answer 2

您可以使用style attr，在此示例中将起作用

if( $('#tblTowerSubTowerLotPricing').attr('style') == 'background-color:rgba(217,244,252,1);')

if( $('#tblTowerSubTowerLotPricing').attr('style') == 'background-color:rgba(217,244,252,1);') {
      alert('It equal block');
     
} else {
      alert('It did not equal block');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="tblTowerSubTowerLotPricing" style="background-color:rgba(217,244,252,1);">Test</div>

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

2 个答案: