Question

我有一个这样的表格行

此行是使用jquery中的for循环生成的，最多可以包含1行。我想删除除每一行的第一行之外的所有元素，我已经尝试过这样

for (var i = 0; i < o.result[0].length; i++) {
  //$("#fullSelection"+i).empty(); //its working
  //$("#fullSelection"+i).not(':first').remove();//not working
  $("#fullSelection" + i).slice(1).remove(); //not working
}

<tr id='fullSelection0' style='display: table-row;'>
  <th class='predict'>

  </th>
  <td>
  </td>
  <td>
  </td>
  <td>
  </td>
</tr>

任何想法如何实现？

Answer 1

HTML表具有两种单元格：

标题单元格-包含标题信息（使用<th>元素创建）

标准单元格-包含数据（使用<td>元素创建）

在HTML表格设计中，不应在同一个 tr 中将 th 和 td 组合在一起。

我认为您不需要为此循环。您可以使用jQuery选择器简单地定位并删除所有tr中的第一个子元素，除了：

$('tr td,th').not(':first-child').remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr id='fullSelection0' style='display: table-row;'>
    <th class='predict'>Col-Test</th>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  
  <tr id='fullSelection1' style='display: table-row;'>
    <th class='predict'>Col-Test2</th>
    <td>11</td>
    <td>22</td>
    <td>33</td>
  </tr>
</table>

Answer 2

您可以使用not和:first--child

做纯CSS

tr>td:not(:first-child) {
  display: none;
}

<table>
  <tr id='fullSelection0' style='display: table-row;'>
    <th class='predict'>Col-Test</th>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>

  <tr id='fullSelection1' style='display: table-row;'>
    <th class='predict'>Col-Test2</th>
    <td>11</td>
    <td>22</td>
    <td>33</td>
  </tr>
</table>

Answer 3

您可以通过以下方式进行操作。

$("tr > td:not(:first-child)").remove();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr id='fullSelection0' style='display: table-row;'>
    <th class='predict'>Col-Test</th>
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
  
  <tr id='fullSelection1' style='display: table-row;'>
    <th class='predict'>Col-Test2</th>
    <td>11</td>
    <td>22</td>
    <td>33</td>
  </tr>
</table>

如何从表行中删除除第一行以外的所有元素

3 个答案: