解决 innerHTML 在 IE6-IE9中不能赋值的bug
在MSDN可以了解跟多,关于innerHTML的介绍,但是在这里只要是解决表格部分问题
MSDN上有这样的记录:
When using innerHTML to insert script, you must include the defer attribute in the script element.
The innerHTML property is read-only on the col, colGroup, frameSet, html, head, style, table, tBody, tFoot, tHead, title, and tr objects.
col、colGroup、frameset、html、head、style、table、tfoot、tHead、title和tr的innerHTML都是只读的
但是在IE10以及以上版本修复这个问题,那当我们在使用表格快捷插入对象时,该怎么实现尼?
先来看看问题:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<table class="table" id="table">
<tbody> </tbody>
</table>
</body>
</html>
var tbody = document.getElementsByTagName("tbody")[0];
var str = "<tr><td>IE6-IE9不能使用该方式,我该怎么办</td></tr>";
tbody.innerHTML = str;


解决方式: 可以借用其它元素(document中存在,也可以是文档碎片(未加入文档))辅助完成
var tbody = document.getElementsByTagName("tbody")[0];
var str = "<tr><td>IE6-IE9不能使用该方式,我该怎么办</td></tr>";
// tbody.innerHTML = str;
var div = document.createElement("div");
div.innerHTML = "<table>" + str + "</table>"; //这里为什么要加外围table 因为div中是不能直接追加 表单元素(thead tbody tr td...)
tbody.appendChild(div.firstChild.firstChild);
那我们来看看效果:
上面代码主要先穿件一个支持innerHTML属性的父容器来包裹 表格元素,再通过appendChild方式追加到表格元素中,这只是其中一种当然可能还有更好办法,欢迎补充
解决 innerHTML 在 IE6-IE9中不能赋值的bug的更多相关文章
- IE9中Media queries在iframe无效的解决方法
在css中有5个media querie @media screen and(min-width:0px)and(max-width:319px){ body {background-color:re ...
- .NET在IE9中页面间URL传递中文变成乱码的解决办法
在.Net的项目中,鼠标点击查询按钮,转到查询页面,但URL中包含中文时,传到服务器端后,中文变成了乱码(只有IE9出现该问题). 尝试使用Server.UrlEncode()进行编码, ...
- IE6/7中li浮动外边距无法撑开ul的解决方法
昨天群里有人提出了这样的问题: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 < ...
- Html中DIV成为超级链接,解决在360浏览器+IE9显示小手图标的兼容性!
Html中DIV成为超级链接,解决在360浏览器+IE9显示小手图标的兼容性! <div style="cursor:pointer;" onclick="sele ...
- span 右浮动折行 解决ie6/7中span右浮动折行问题
A floated box is shifted to the left or right until its outer edge touches the containing block edge ...
- 完美解决浮动IE6 7中的兼容性BUG问题
想要创建出漂亮的网页设计,除了要认真学习每一个html和CSS代码之外,不可能不去了解一下臭名昭著的IE6和更早的那些IE浏览器的坏脾气,因为你本来写出的规规矩矩的代码,漂亮的设计就此就要完成了,却发 ...
- span 右浮动折行 解决ie6/7中span右浮动折行问题
RM8005: IE6 IE7 IE8(Q) 中行内元素后相邻的浮动元素在某些情况下会折行放置在之前行内元素所在行框的底部 标准参考 W3C CSS 2.1 规范文档里对于浮动元素与非浮动行内元素相邻 ...
- ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法
在IE9,或IE10中ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法 把弹出框嵌入到jquery dialog中.可以解决 I did: // javascript f ...
- 【Java EE 学习 70 下】【数据采集系统第二天】【Action中User注入】【设计调查页面】【Action中模型赋值问题】【编辑调查】
一.Action中User注入问题 Action中可能会经常用到已经登陆的User对象,如果每次都从Session中拿会显得非常繁琐.可以想一种方法,当Action想要获取User对象的时候直接使用, ...
随机推荐
- Sql省市三级联动一张表
CREATE TABLE [dbo].[region]( [region_id] [int] NULL, [region_name] [varchar](50) COLLATE Chinese_PRC ...
- list类型for遍历
package cn.stat.p9.map.demo; import java.util.ArrayList; public class Listfor { /** * @param args */ ...
- C#摇奖程序
private void Form1_Load(object sender, EventArgs e) { //取消跨线层访问控件的判断 Control.CheckForIllegalCrossThr ...
- hihoCoder挑战赛14 A,B,C题解
转载请注明出处: http://www.cnblogs.com/fraud/ ——by fraud 题目1 : 不等式 时间限制:10000ms 单点时限:1000ms 内存限制:2 ...
- php测试题整理(0519)
1.B/S架构和C/S架构: B/S架构是依托于浏览器的网络系统,C/S架构是基于客户端的. B/S架构: 随着Internet和WWW的流行,以往的主机/终端和C/S都无法满足当前的全球网络开放.互 ...
- 4月13日 php
用php打印乘法表: <html> <head> <title>我的第一个PHP页面</title> </head> <body> ...
- Python 基础教程中的问题及解决方案(1)
1. 在ubuntu中,调用终端时如: f = open('/home/theone/test_input.txt', 'r') 中的txt格式文本不能加后缀 正确的应为: f = open('/h ...
- MVC4 路由参数带点 文件名后缀导致错误
错误描述 最近在研究office在线预览,用到mvc4 apicontroller 需要传参是文件名,如test.docx导致错误"指定的目录或文件在 Web 服务器上不存在", ...
- SQL建模错误--逗号分隔值
最近帮一个客户分析SQL语句的问题,大致经过如下 场景: 委托方有一个用于追踪他们产品的系统,每个产品都会卖给许多客户:但是客户又被从业务上分成两类,一类是带有合作伙伴性质的,这个 合作伙伴通常会给予 ...
- div 居中进行总结
1.margin:auto ;让元素居中,需要确定元素的宽度,并且需要是块元素 eg: div { width:200px; height:200px; background:#222; margin ...