javascriptで動的にテーブルを作成するときのIE8以下のバグ
- 時間：2009年12月 4日 14:39
-
delicious に登録
-
はてブに登録
- トラックバック：(0)
- コメント：(0)
【サンプル】
久々のメモ。
現在IE8を使用しているのですがブラウザチェック時にIE6・7共に動的にjavascriptでテーブルを作成したときにはまったのでメモ。
【IE6・7では表示されない記述方法】
//TABLE作成
var TABLE = document.createElement("TABLE");
TABLE.cellPadding =TABLE.cellSpacing=0;
document.body.appendChild(TABLE);
//TR作成
var TR = document.createElement("TR");
TABLE.appendChild(TR);
//TD作成
var TD = document.createElement("TD");
TD.innerHTML="IE6・7だと表示されません";
TR.appendChild(TD);
【IE6・7でも表示される記述方法】
//TABLE作成
var TABLE = document.createElement("TABLE");
TABLE.cellPadding =TABLE.cellSpacing=0;
document.body.appendChild(TABLE);
//TBODY作成
var TBODY = document.createElement("TBODY");
TABLE.appendChild(TBODY);
//TR作成
var TR = document.createElement("TR");
TABLE.appendChild(TR);
//TD作成
var TD = document.createElement("TD");
TD.innerHTML="IE6・7だと表示されません";
TR.appendChild(TD);
上記の様にTR作成時の前にTBODYを作成してTBODYにTRをappendChildしてあげると表示されるようになりました。
alert()してみるとタイトル下の画像のようにきちんとIE6・7でもきちんとappendChildは出来ている様なのでどうやら表示がされていない感じなのかなー。
それを回避するためにTBODYを利用すると一発解決するというメモ。
javascriptで動的にテーブルを作成するときのIE8以下のバグに対してコメントをする