mootoolsのElementプロパティでテーブルを作るとき、階層を守って作らないとIEで表示されない。
見事にハマったので詳細をメモっておくことにする。
※このサンプルは前バージョン(1.1.2)で書いたものなので1.2では動かないかも
たとえば、次のソースだとIEで表示されない。
HTMLソースは確認できるが、テーブルがhiddenな状態になってしまう。
var table = new Element('table'); var tr = new Element('tr').injectInside(table); var th = new Element('th').setText('test').injectInside(tr); var td = new Element('td').setText('sample').injectAfter(th);
原因は
table>thead>tfoot>tbody>tr>td
この構造か
table>tbody>tr>td
この構造を守ってないからで
trの前にtbodyを作っておく必要がある。
var table = new Element('table'); var tbody =new Element('tbody').injectInside(table); var tr = new Element('tr').injectInside(tbody); var th = new Element('th').setText('test').injectInside(tr); var td = new Element('td').setText('sample').injectAfter(th);