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 colcolGroupframeSethtmlheadstyletabletBodytFoottHeadtitle, and tr objects.

col、colGroup、frameset、html、head、style、table、tfoot、tHead、title和tr的innerHTML都是只读的

但是在IE10以及以上版本修复这个问题,那当我们在使用表格快捷插入对象时,该怎么实现尼?

先来看看问题:  

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. </head>
  7. <body>
  8. <table class="table" id="table">
  9. <tbody>
  10.  
  11. </tbody>
  12. </table>
  13. </body>
  14. </html>
  1. var tbody = document.getElementsByTagName("tbody")[0];
  2. var str = "<tr><td>IE6-IE9不能使用该方式,我该怎么办</td></tr>";
  3. tbody.innerHTML = str;

解决方式: 可以借用其它元素(document中存在,也可以是文档碎片(未加入文档))辅助完成

    

  1. var tbody = document.getElementsByTagName("tbody")[0];
  2. var str = "<tr><td>IE6-IE9不能使用该方式,我该怎么办</td></tr>";
  3. // tbody.innerHTML = str;
  4. var div = document.createElement("div");
  5. div.innerHTML = "<table>" + str + "</table>"; //这里为什么要加外围table 因为div中是不能直接追加 表单元素(thead tbody tr td...)
  6. tbody.appendChild(div.firstChild.firstChild);

那我们来看看效果:

上面代码主要先穿件一个支持innerHTML属性的父容器来包裹 表格元素,再通过appendChild方式追加到表格元素中,这只是其中一种当然可能还有更好办法,欢迎补充

解决 innerHTML 在 IE6-IE9中不能赋值的bug的更多相关文章

  1. IE9中Media queries在iframe无效的解决方法

    在css中有5个media querie @media screen and(min-width:0px)and(max-width:319px){ body {background-color:re ...

  2. .NET在IE9中页面间URL传递中文变成乱码的解决办法

     在.Net的项目中,鼠标点击查询按钮,转到查询页面,但URL中包含中文时,传到服务器端后,中文变成了乱码(只有IE9出现该问题).       尝试使用Server.UrlEncode()进行编码, ...

  3. 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 < ...

  4. Html中DIV成为超级链接,解决在360浏览器+IE9显示小手图标的兼容性!

    Html中DIV成为超级链接,解决在360浏览器+IE9显示小手图标的兼容性! <div style="cursor:pointer;" onclick="sele ...

  5. span 右浮动折行 解决ie6/7中span右浮动折行问题

    A floated box is shifted to the left or right until its outer edge touches the containing block edge ...

  6. 完美解决浮动IE6 7中的兼容性BUG问题

    想要创建出漂亮的网页设计,除了要认真学习每一个html和CSS代码之外,不可能不去了解一下臭名昭著的IE6和更早的那些IE浏览器的坏脾气,因为你本来写出的规规矩矩的代码,漂亮的设计就此就要完成了,却发 ...

  7. span 右浮动折行 解决ie6/7中span右浮动折行问题

    RM8005: IE6 IE7 IE8(Q) 中行内元素后相邻的浮动元素在某些情况下会折行放置在之前行内元素所在行框的底部 标准参考 W3C CSS 2.1 规范文档里对于浮动元素与非浮动行内元素相邻 ...

  8. ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法

    在IE9,或IE10中ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法   把弹出框嵌入到jquery dialog中.可以解决 I did: // javascript f ...

  9. 【Java EE 学习 70 下】【数据采集系统第二天】【Action中User注入】【设计调查页面】【Action中模型赋值问题】【编辑调查】

    一.Action中User注入问题 Action中可能会经常用到已经登陆的User对象,如果每次都从Session中拿会显得非常繁琐.可以想一种方法,当Action想要获取User对象的时候直接使用, ...

随机推荐

  1. 今天工作中遇到的根据用户id取得产品大类和相关小类的问题

    今天做了一个项目,需求是客户登陆后,可以从会员中心发布详细信息(包括联系信息和公司信息),插入到数据库后在将来生成一个公司页面模板,一般的产品大类+小类 用repeater嵌套就可以了,但是这个涉及到 ...

  2. ViewPager欢迎页

    布局  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:to ...

  3. C#生成高清缩略图

    /// <SUMMARY> /// 为图片生成缩略图 /// </SUMMARY> /// <PARAM name="phyPath">原图片的 ...

  4. shell获取日期(昨天,明天,上月,下月)

    今天 sh-4.1$ echo `date +%Y-%m-%d` 2016-08-17 昨天 sh-4.1$ echo `date -d "last day" +%Y-%m-%d` ...

  5. avalon

    http://avalonjs.coding.me/ 有时间详细写

  6. C#摇奖程序

    private void Form1_Load(object sender, EventArgs e) { //取消跨线层访问控件的判断 Control.CheckForIllegalCrossThr ...

  7. iOS中的UIWindow

    UIWindow的作用 UIWindow主要有两个作用: 1 作为UIView视图的最顶层容器,包含所有要显示的UIView 2 传递触摸,非触摸,键盘事件,其中传递非触摸和键盘事件时,UIWindo ...

  8. 绘制数据图表的又一利器:C3.js

  9. iOS学习之页面之间传值的方式总结

    传值三种场景: 1.属性传值(从前往后传) 需求:第二个界面标签显示第一个界面输入框文字. 第一步, 在前一个界面定义属性. (语义属性声明为copy); 第二步, 在进入下一个界面之前,给属性传入数 ...

  10. Windows server 2012 各版本 激活方法

    Windows server 2012 激活教程 本文包括以下两种版本的激活过程:(注意RC版的是不能激活的!) 1.Windows server 2012 试用版本激活 2.Windows serv ...