htmltdtr:在HTML中使用JavaScript创建TR和TD的方法



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

延伸阅读

最新评论

发表评论