1. ホーム
  2. css

[解決済み] <div style="display:none">によるテーブルデータの非表示。

2022-02-01 10:44:11

質問

そこで、このようにテーブル全体を非表示にしたところ、正常に動作するようになりました。

<div style="display:none">
<table>
<tr><th>Test Table</th><tr>
<tr><td>123456789</td><tr>
<tr><td>123456789</td><tr>
<tr><td>123456789</td><tr>
</table>
</div>

でも、こんな風に行のグループだけ隠したい。

<table>
<tr><th>Test Table</th><tr>
<div style="display:none">
<tr><td>123456789</td><tr>
<tr><td>123456789</td><tr>
<tr><td>123456789</td><tr>
</div>
</table>

しかし、これではうまくいきません。 何かヒントはありませんか?

解決方法は?

trタグにstyle属性を適用するだけです。複数のtrタグがある場合は、それぞれの要素にstyleを適用するか、tbodyタグで囲む必要があります。

<table>
  <tr><th>Test Table</th><tr>
  <tbody style="display:none">
    <tr><td>123456789</td><tr>
    <tr><td>123456789</td><tr>
    <tr><td>123456789</td><tr>
  </tbody>
</table>