IE6-IE9不支持table.innerHTML的解决方法分享


Posted in Javascript onSeptember 14, 2012

测试代码:

<table id="test"> 
</table> 
<script> 
var oTable=document.getElementById("test"); 
oTable.innerHTML="<tr><td>innerHTML</td></tr>"; 
</script>

上述代码在IE6-9中无效,直接报错:

IE9:Invalid target element for this operation.

IE6-8:Unknown runtime error

查找IE的文档(http://msdn.microsoft.com/en-us/library/ms533897(VS.85).aspx)后发现有这么一段:

The innerHTML property is read-only on the col, colGroup, frameSet, html, head, style, table, tBody, tFoot, tHead, title, and tr objects.

所以只能用其他方案解,我的方案:
var oTable=document.getElementById("test"); 
//oTable.innerHTML="<tr><td>innerHTML</td></tr>"; 
setTableInnerHTML(oTable,"<tr><td>innerHTML</td></tr>"); function setTableInnerHTML(table, html) { 
if(navigator && navigator.userAgent.match(/msie/i)){ 
var temp = table.ownerDocument.createElement('div'); 
temp.innerHTML = '<table><tbody>' + html + '</tbody></table>'; 
if(table.tBodies.length == 0){ 
var tbody=document.createElement("tbody"); 
table.appendChild(tbody); 
} 
table.replaceChild(temp.firstChild.firstChild, table.tBodies[0]); 
} else { 
table.innerHTML=html; 
} 
}

这里只是对table做了处理,对其他不支持的元素可以用类似的方案。

另外,IE10中table已经支持innerHTML了。

作者:Artwl

Javascript 相关文章推荐
javascript 解析后的xml对象的读取方法细解
Jul 25 Javascript
js 字符串操作函数
Jul 25 Javascript
利用JQuery和Servlet实现跨域提交请求示例分享
Feb 12 Javascript
chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式
Oct 09 Javascript
老生常谈遮罩层 滚动条的问题
Apr 29 Javascript
利用jQuery实现CheckBox全选/全不选/反选的简单代码
May 31 Javascript
微信小程序 教程之列表渲染
Oct 18 Javascript
vue-cli webpack 引入jquery的方法
Jan 10 jQuery
纯javascript实现选择框的全选与反选功能
Apr 08 Javascript
Vue实现base64编码图片间的切换功能
Dec 04 Javascript
使用JavaScript获取扫码枪扫描得到的条形码的思路代码详解
Jun 10 Javascript
JS数组方法some、every和find的使用详情
Oct 05 Javascript
javascript时区函数介绍
Sep 14 #Javascript
推荐40个简单的 jQuery 导航插件和教程(下篇)
Sep 14 #Javascript
推荐40款强大的 jQuery 导航插件和教程(上篇)
Sep 14 #Javascript
基于JQuery的一句话搞定手风琴菜单
Sep 14 #Javascript
JQuery select控件的相关操作实现代码
Sep 14 #Javascript
11个用于提高排版水平的基于jquery的文字效果插件
Sep 14 #Javascript
六款帮助你实现惊艳视差滚动效果的jQuery插件
Sep 14 #Javascript
You might like
php从数据库查询结果生成树形列表的方法
2015/04/17 PHP
Apache启动报错No space left on device: AH00023该怎么解决
2015/10/16 PHP
laravel 解决ajax异步提交数据,并还回填充表格的问题
2019/10/15 PHP
JavaScript创建一个欢迎cookie弹出窗实现代码
2013/03/15 Javascript
javaScript如何生成xmlhttp
2013/12/16 Javascript
基于jquery的文字向上跑动类似跑马灯的效果
2014/09/22 Javascript
浅谈jquery事件处理
2015/04/24 Javascript
jQuery实现可关闭固定于底(顶)部的工具条菜单效果
2015/11/06 Javascript
jquery自定义显示消息数量
2017/12/19 jQuery
Vue源码探究之虚拟节点的实现
2019/04/17 Javascript
微信小游戏之使用three.js 绘制一个旋转的三角形
2019/06/10 Javascript
javascript function(函数类型)使用与注意事项小结
2019/06/10 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
2019/09/28 Javascript
vue 实现LED数字时钟效果(开箱即用)
2019/12/08 Javascript
jQuery实现高度灵活的表单验证功能示例【无UI】
2020/04/30 jQuery
在Python中调用ggplot的三种方法
2015/04/08 Python
python安装oracle扩展及数据库连接方法
2017/02/21 Python
Python贪吃蛇游戏编写代码
2020/10/26 Python
python 调用win32pai 操作cmd的方法
2017/05/28 Python
Python 计算任意两向量之间的夹角方法
2019/07/05 Python
keras获得某一层或者某层权重的输出实例
2020/01/24 Python
python实现根据给定坐标点生成多边形mask的例子
2020/02/18 Python
对CSS3选择器的研究(详解)
2016/09/16 HTML / CSS
CSS3模块的目前的状况分析
2010/02/24 HTML / CSS
世界领先的高品质定制产品平台:Zazzle
2017/07/23 全球购物
平面设计自荐信
2013/10/07 职场文书
学校门卫工作职责
2013/12/07 职场文书
《小熊住山洞》教学反思
2014/02/21 职场文书
网站客服岗位职责
2014/04/05 职场文书
奉献爱心演讲稿
2014/09/04 职场文书
营业用房租赁协议书
2014/11/26 职场文书
安全教育第一课观后感
2015/06/17 职场文书
旷工检讨书大全
2015/08/15 职场文书
Django中session进行权限管理的使用
2021/07/09 Python
CentOS7安装GlusterFS集群以及相关配置
2022/04/12 Servers
Vue Element plus使用方法梳理
2022/12/24 Vue.js