Question

我根据特定条件获取表格行。这是我的代码结构

  <tr start="7" row="1" class="tableinsideth trmain">
     <td>&nbsp;</td>
  </tr>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>                             
    <td class="tdclass dateclass esl" >Available</td>
  </tr>

我只想删除<td>上面的esl，或者以其他方式删除第一个td，当我们连续超过1个td时。在css中尝试~但没有取得任何成功。任何帮助将受到高度赞赏。

Answer 1

您可以使用:first-child隐藏td中的第一个tr。

然后使用:only-child确保td没有显示其他兄弟。

td:first-child {
  display: none;
}

td:only-child {
  display: table-cell;
}

<table>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbspTEST;</td>
  </tr>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;TEST2</td>
    <td class="tdclass dateclass esl">Available</td>
  </tr>
</table>

Answer 2

你可以用css做你想做的事

首先使用:first-child
然后使用:last-child显示最后一个单元格，如果要显示一个唯一单元格，则需要显示

请参阅代码段：

＆＃13;

table td:first-child {
 display:none;
}

table td:last-child{
 display:table-cell;
}

＆＃13;

<table border=1>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>
  </tr>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>
    <td class="tdclass dateclass esl">Available</td>
  </tr>
  
   <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>
    <td class="tdclass dateclass esl">Available</td>
    <td class="tdclass dateclass esl">Available</td>
    <td class="tdclass dateclass esl">Available</td>
  </tr>

</table>

＆＃13;

Answer 3

试试这个

$('.esl').prev().hide();

Answer 4

您可以使用prev按照here所述获取jquery中的上一个兄弟。所以你可以这样做：

$document.ready(function() {    
    $.("es1").prev().remove() 
});

Answer 5

你可以使用CSS在CSS上使用CSS，这取决于你正在使用的js框架。祝好运！

table td:only-of-type {
 display:table-cell !important;
}
table td{
 display:none;
}

.tdclass.dateclass.esl{
  display:table-cell !important;
 }

<table border=1>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>
  </tr>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>
    <td class="tdclass dateclass esl">Available</td>
  </tr>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>
    <td class="tdclass dateclass esl">Available</td>
    <td class="tdclass dateclass esl">Available</td>
    <td class="tdclass dateclass esl">Available</td>
    <td class="tdclass dateclass esl">Available</td>
    <td class="tdclass dateclass esl">Available</td>
  </tr>
  <tr start="7" row="1" class="tableinsideth trmain">
    <td>&nbsp;</td>
  </tr>

</table>

Answer 6

尝试：

$(document).ready(function(){
    $('table .tableinsideth').each(function() {
        if ($(this).find('td').length > 1){
            $(this).find('td').first().remove();
        }
    });
});

根据CSS或jquery中的下一个类名，仅隐藏表行中的特定内容

6 个答案: