您的位置:首页 > Web前端 > JavaScript

JavaScript Tip/Trick: 动态创建Table时,在IE中需要注意的一个问题

2005-01-01 00:00 831 查看
A small trick when creating table dynamically with javascript.

下面这种方式可以创建table,并附加到Dom树中,但是在IE中是不显示的:

var table = document.createElement("TABLE");

var tr = document.createElement("TR");

var td = document.createElement("TD");

var text = document.createTextNode("testt");

td.appendChild(test);

tr.appendChild(td);

table.appendChild(tr);

document.body.appendChild(table);

不报错,用Dom查看器也可以看到整个table被完整创建了,并附加到body里面,但就是不显示。这是因为在IE里不允许将tr直接附加到table里,而要先将tr附加到tbody中,然后再将tbody附加到table下。所以正确的应该是:

var table = document.createElement("TABLE");

var tbody = document.createElement("TBODY");

var tr = document.createElement("TR");

var td = document.createElement("TD");

var text = document.createTextNode("testt");

td.appendChild(test);

tr.appendChild(td);

tbody.appendChild(tr)

table.appendChild(tbody);

document.body.appendChild(table);

FireFox中不存在这个问题。需要注意的是显性的利用HTML构造table时,tbody元素不是必须的,可能IE在解析的时候会自动加入tbody吧,否则就解释不通了?
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: