ie和firefox操作table对象的异同
cookqq ›博客列表 ›html

ie和firefox操作table对象的异同

2013-06-25 17:14:59.0|分类: html|浏览量: 1601

摘要: ie和firefox下操作table对象的异同【测试浏览器版本:ie为8,9,firefox为2.0】 1)在ie下...
ie和firefox下操作table对象的异同【测试浏览器版本:ie为8,9,firefox为2.0】

1)在ie下,table标签直接使用appendChild增加document.createElement('tr')的行时不显示,但是在firefox下是没有问题的。如下

?
<table id="table1" border='1'></table>
<script type='text/javascript'>
var tb=document.getElementById('table1');
var tr=document.createElement('tr'),td=document.createElement('td');
td.innerHTML=new Date();
tr.appendChild(td);//行增加单元格
tb.appendChild(tr);//表增加行
</script>
运行上面的代码后,和描述一样吧。
注意:tr .innerHTML =“”;这句话在ie下不能使用
解决办法就是在table标签内增加tbody标签,tbody使用appendChild时在ie和firefox下都可以显示了。

?
<table border='1'><tbody id="tbody1"></tbody></table>
<script type='text/javascript'>
var tb=document.getElementById('tbody1');
var tr=document.createElement('tr'),td=document.createElement('td');
td.innerHTML=new Date();
tr.appendChild(td);//行增加单元格
tb.appendChild(tr);//表增加行
</script>
 
 
2) 使用insertRow和insertCell插入行和单元格时需要注意的 ,在ie下可以不传递行号和列号,但是如果在firefox下,必须要传递,要不出错。【insertRow和insertCell可以为table标签也可以为tbody标签,这两则都可以用】如下
 
?
<table id="table2" border='1'></table>
<script type='text/javascript'>
var tb=document.getElementById('table2');
var tr=tb.insertRow(),td=tr.insertCell();
td.innerHTML=new Date();
</script>
 
运行上面的代码在ie下可以插入行和单元格,但是在firefox下出现“uncaught exception: [Exception... "Not enough arguments" nsresult: "0x80570001 (NS_ERROR_XPC_NOT_ENOUGH_ARGS)" location: "JS frame :: file:///E:/IISDebug/ajax/table.htm :: <TOP_LEVEL> :: line 32" data: no]”的错误

解决办法就是把行号和列号作为参数传入
但是要注意,传递的行号不能大于当前的行的长度,如已经有2行,你可以传递2,但是不能传递3。就如同强类型语言的数组一样,不能越界
<table id="table3" border='1'></table>
<script type='text/javascript'>
var tb=document.getElementById('table3');
var tr=tb.insertRow(tb.rows.length)//这样传递,插入在最后,你也可以传递其他的
  ,td=tr.insertCell(0);
td.innerHTML=new Date();
</script>

参考: http://www.cnblogs.com/oneroundseven/archive/2011/03/02/1968751.html

一键分享文章

分类列表

  • • struts源码分析
  • • flink
  • • struts
  • • redis
  • • kafka
  • • ubuntu
  • • zookeeper
  • • hadoop
  • • activiti
  • • linux
  • • 成长
  • • NIO
  • • 关键词提取
  • • mysql
  • • android studio
  • • zabbix
  • • 云计算
  • • mahout
  • • jmeter
  • • hive
  • • ActiveMQ
  • • lucene
  • • MongoDB
  • • netty
  • • flume
  • • 我遇到的问题
  • • GRUB
  • • nginx
  • • 大家好的文章
  • • android
  • • tomcat
  • • Python
  • • luke
  • • android源码编译
  • • 安全
  • • MPAndroidChart
  • • swing
  • • POI
  • • powerdesigner
  • • jquery
  • • html
  • • java
  • • eclipse
  • • shell
  • • jvm
  • • highcharts
  • • 设计模式
  • • 列式数据库
  • • spring cloud
  • • docker+node.js+zookeeper构建微服务
版权所有 cookqq 感谢访问 支持开源 京ICP备15030920号
CopyRight 2015-2018 cookqq.com All Right Reserved.