jquery - 表内 td 的对齐

Question

我有一个包含很多行的表格。每行都有标题广告表数据。当我隐藏一个表数据时，它会删除空间，但会保留行内空间。任何解决方案将不胜感激。

到目前为止，我已经尝试使用 css 显示但没有成功。

<table>
  <tbody>
    <tr>
      <th>1</th>
      <td>2</td>
      <th>3</th>
      <td>4</td>
    </tr>
    <tr>
      <th>a</th>
      <td>b</td>
      <th>c</th>
      <td>d</td>
    </tr>
    <tr>
      <!-- adding display none from jquery as table loads from server -->
      <th style="display:none">a</th>
      <td style="display:none">b</td>      
      <th>c</th>
      <td>d</td>
    </tr>
    <tr>
      <th>a</th>
      <td>b</td>
      <th>c</th>
      <td>d</td>
    </tr>
    <tr>
      <th>a</th>
      <td>b</td>
      <th>c</th>
      <td>d</td>
    </tr>
  </tbody>
</table>

Display none 隐藏元素但该行有一个空白空间。有没有办法重新对齐所有的 tds，这样它就不会显示隐藏的空间。

Answer 1

<table>
  <tbody>
    <tr>
      <th>1</th>
      <td>2</td>
      <th>3</th>
      <td>4</td>
    </tr>
    <tr>
      <th>a</th>
      <td>b</td>
      <th>c</th>
      <td>d</td>
    </tr>
    <tr>
      <!-- adding display none from jquery as table loads from server -->
      <th style="visibility:hidden">a</th>
      <td style="visibility:hidden">b</td>      
      <th>c</th>
      <td>d</td>
    </tr>
    <tr>
      <th>a</th>
      <td>b</td>
      <th>c</th>
      <td>d</td>
    </tr>
    <tr>
      <th>a</th>
      <td>b</td>
      <th>c</th>
      <td>d</td>
    </tr>
  </tbody>
</table>