Question

我们在一个HTML页面中有数千个表。其中大部分都是空的，并使用display：none隐藏。

我们只想显示那些有行的表。但是下面的代码不起作用。使用Jquery。

＆＃13;

$('.table1').each(function() {
  if ($(this).find('TD')) {
    $(this).show();
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
  <CAPTION>pillowsandcushions-au:</CAPTION>
  <TR id="TR_311511608755">
    <TD ALIGN="center">Family 4 Pack Of Bed Pillows, Soft Medium Firm Australian Made Cotton Cover New</TD>
  </TR>


  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>freodarts:</CAPTION>
  </TABLE>

  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>2clickshere:</CAPTION>
  </TABLE>

＆＃13;

Answer 1

$(this).find("td")总是返回一个jQuery对象，即使选择器没有找到任何东西，并且一个对象总是真的。如果您想知道是否匹配，请获取长度。

$('.table1').each(function() {
  if ($(this).find('TD').length > 0) {
    $(this).show();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
  <CAPTION>pillowsandcushions-au:</CAPTION>
  <TR id="TR_311511608755">
    <TD ALIGN="center">Family 4 Pack Of Bed Pillows, Soft Medium Firm Australian Made Cotton Cover New</TD>
  </TR>


  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>freodarts:</CAPTION>
  </TABLE>

  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>2clickshere:</CAPTION>
  </TABLE>

此外，您可以使用:has选择器代替循环。

$('.table1:has(td)').show();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
  <CAPTION>pillowsandcushions-au:</CAPTION>
  <TR id="TR_311511608755">
    <TD ALIGN="center">Family 4 Pack Of Bed Pillows, Soft Medium Firm Australian Made Cotton Cover New</TD>
  </TR>


  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>freodarts:</CAPTION>
  </TABLE>

  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>2clickshere:</CAPTION>
  </TABLE>

Answer 2

你的测试是错误的，因为它总是会产生一个真值（一个jQuery对象）。您需要将测试更改为if ($(this).find('TD').size())。我已在下面编辑了您的代码段。

$('.table1').each(function() {
  if ($(this).find('TD').size()) {
    $(this).show();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
  <CAPTION>pillowsandcushions-au:</CAPTION>
  <TR id="TR_311511608755">
    <TD ALIGN="center">Family 4 Pack Of Bed Pillows, Soft Medium Firm Australian Made Cotton Cover New</TD>
  </TR>
</TABLE>

  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>freodarts:</CAPTION>
  </TABLE>

  <TABLE BORDER="3" CELLSPACING="1" CELLPADDING="1" class="table1" style="display:none;">
    <CAPTION>2clickshere:</CAPTION>
  </TABLE>

如果表有行，如何显示表？

2 个答案: