自分で手書きHTMLのWebページを作成しています。
HTML中のテーブルの列の非表示・再表示を高速に行いたくて、スタイルシートの「display: none;」を試してみました。
自分の WinXP 環境でテストしたところ、InternetExplorer ではうまくいきます。
しかし、同じWinXP のFirefox 2.0.0.11 の場合にうまくいきません。 tdタグに上記の display を書くと希望通りそのセルが非表示になるのですが、col タグや colgroupタグに書いても何も起らないのです。 そういう仕様なんでしょうか？
以下は、上で書いたことを確認するためのHTMLです。
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<title>テーブル列非表示</title>
</head>
<body>
<h1>テーブル列非表示</h1>
<p>
第2列を
<button type="button" onclick="document.all.target.style.display = 'none';">非表示</button>
<button type="button" onclick="document.all.target.style.display = '';">表示</button>
</p>
<p>
中央セルを
<button type="button" onclick="document.all.centerCell.style.display = 'none';">非表示</button>
<button type="button" onclick="document.all.centerCell.style.display = '';">表示</button>
</p>
<table border="1">
<col><col id="target"><col><col style="display: none;">
<tr><td>常に</td><td>ボタンで</td><td>****</td><td>常に</td></tr>
<tr><td>表示</td><td id="centerCell">切り替え</td><td>####</td><td>非表示</td></tr>
<tr><td>される</td><td>られる</td><td>@@@@</td><td>だよ</td></tr>
</table>
</body>
</html>
ログイン
ユーザー登録
FAQ
検索
