« IE6のDOMにはsetAttributeメソッドがない? | トップページ | ロードマンのブレーキ:アルホンガのHJ-714AG »

2007.11.03

IE6ではテーブル要素の動的生成時にtbodyを生成しないとだめみたい

IE6ではドキュメントロード時にテーブル要素をDOM使って生成する場合、theadやtbodyを生成しなければいけないようです。

FireFoxではどっちでもいいみたいですが。。。

静的なhtmlに書く時は、省略するケースが多いが、IEはこれを補ってくれている。でも、javascriptから動的に生成するときは補ってくれない模様。

以下のサンプルではテーブルが表示されません。

// [javascript]
// TABLEの動的生成
var body = document.getElementsByTagName('body')[0];
var table = document.createElement('table');
var tr = document.createElement('tr');
var th = document.createElement('th');
var text = document.createTextNode('これだめ!');
th.appendChild(text);
tr.appendChild(th);
table.appendChild(tr);
body.appendChild(table);

以下のようにするとOK

// [javascript]
// TABLEの動的生成
var body = document.getElementsByTagName('body')[0];
var table = document.createElement('table');
//↓これが必要!
var tbody = document.createElement('tbody');
var tr = document.createElement('tr');
var th = document.createElement('th');
var text = document.createTextNode('おめでとー');
th.appendChild(text);
tr.appendChild(th);
//IEはtbodyを補ってくれないので
//↓こうしないといかんの
tbody.appendChild(tr);
table.appendChild(tbody);
body.appendChild(table);

« IE6のDOMにはsetAttributeメソッドがない? | トップページ | ロードマンのブレーキ:アルホンガのHJ-714AG »

プログラミング」カテゴリの記事

javascript / jQuery」カテゴリの記事

コメント

http://www.doraneko.org/misc/dom10/19981001/level-one-html.html#ID-64060425
insertRowメソッドを使う場合は、TBODYを自動的に作ってくれるので意識しないですみます。

BLUEPIXY様。もしかしてCASLシミュレータの作者さんですか?そいで、第1種情報処理技術者さんなのですね。あっしは、受けましたが落ちましたわ。ははは。2種だけ持ってます。いずれにせよ昔々の話ですが。

あ、本題について言及してなかった。
insertRowで自動で作ってくれるのですか、それはうれしい限り。こんど使います。ありがとうさまです。

>CASLシミュレータの作者さんですか?
そうです。
そんな風に呼びかけられたのは初めてなのでびっくりです。
(普段ちっとも反応はありません・)
>第1種情報処理技術者
古さがしのばれますね・w

thは、appendChildする必要がありますが、
tdは、insertCellで作成できます。
createElement~appendChildする必要がないので見通しがいいかと思います。

BLUEPIXYさん、お名前で検索すると、ベクターのCASL2シミュレータがでてきたので。懐かしいなと。
なんか、ソフト関連の興味の方向が似てる気がします。

Thank you very much!!!助かった。

さん、
お役に立てて光栄です。IEで苦労されてますか。
がんばってください。

コメントを書く

(ウェブ上には掲載しません)

トラックバック

« IE6のDOMにはsetAttributeメソッドがない? | トップページ | ロードマンのブレーキ:アルホンガのHJ-714AG »

2019年5月
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31  
フォト

Google AdSense

銀の弾丸

無料ブログはココログ

他のアカウント