有时候我们需要动态的创建Tr和Td对象. 这真是一个好东西, 不过在FireFox当中, 呵呵, 这个貌似不管用, 运行第二句就彻底玩完了. 应该写成下面这样 FireFox中完全是按照XML的写法来的, 这个代码在IE当中执行完全没有问题, 如果你想创建一个空的TR的话. var tr = ... 但是有个问题我没有搞明白, 就是按照上面说的理解, appendChild方法没有将TR插入到rows或者没有将TD插入到cells里面的话, 理论上应该不显示任何东西, 也就是Table下面在IE中认为什么都没有, 实际上我写了一个最简单的HTML来测试, 也是如此. 这是我得出这个结论的依据. 不过在我真正做的项目中却并非如此, 所有的TR和TD都非常正确的被显示出来了, 只是内容完全没有, 尽管innerHTML完全正确. 真是纳闷不已.
这里要说的是在IE中和在FireFox中不同之处.
假设我们有下面这个玩意, 一个Table的壳子.
<table id="table">
</table>
现在需要创建一个TR
IE中如下:
var table = document.getElementById("table");
var tr = table.insertRow();
var table = document.getElementById("table");
var tr = document.createElement("tr");
table.appendChild(tr);
不过TD里面的内容则完全显示不出来. 我查了MSDN, 他是这么说的: "insertRow方法在Table/TBody/THead/TFoot中创建一个行对象, 并且将他插入到rows里面." 而appendChild方法似乎后一句没有做到.
td的操作方式也是一样
if (ie) ...{
var td = tr.insertCell();
} else ...{
var td = document.createElement("td");
tr.appendChild(td);
}