IE6/IE7/IE8/IE9中tbody的innerHTML不能赋值的完美解决方案

IE6/IE7/IE8/IE9中tbody的innerHTML不能赋值，重现代码如下复制代码代码如下：DOCTYPE html html head meta charset=' utf-8 '/title ie6-IE9中tbody的innerHTML不能复制bug/title/head body style=' height :3000 px ' table t body TRT AAA/TD/tr/t body/table p button id=' BTN 1 ' GET/button id=' BTN 2 ' SET/button/p脚本var t body=document。getelementsbytagname(' t body '[0])函数setbody(){ tbody。innerhtml=' TRT BBB/TD/tr ' }函数getbody(){ alert(tbody。BTN 1 onclick .两个按钮，第一个获取tbody的innerHTML，第二个设置tbody的内部HTML。获取时所有浏览器都弹出了tr的字符串，但设置时IE6-9不支持，而且报错，如图

可以利用特性判断来看浏览器是否支持tbody的innerHTML设值复制代码代码如下： var isupporttbodinerhtml=function(){ var table=document。create element(' table ')var t body=document。createelement(' t body ')表。append child(t body)var boo=true try { t body。innerhtml=' tr/tr ' } catch(e){ boo=false } return boo }()alert(isupporttbodinerhtml)对于IE6-IE9里如果要设置tbody的innerHTML，可以使用如下替代方法复制代码代码如下：函数setbodyinnerhtml(t body，html){ var div=document。createelement(' div ')div。inner html=' table ' html '/table ' while(t body。第一个孩子。移除主体。第一个孩子)t身体。appendchild(div。第一个孩子。第一个孩子)}用一个差异来包含一个桌子，然后删除tbody里的所有元素，最后给tbody添加差异的第一个元素的第一个元素，即divtabletr。当然还有一个更精简的版本，它直接采用replaceChild方法替换复制代码代码如下：函数setbodyinnerhtml(t body，html){ var div=document。createelement(' div ')div。inner html=' table ' html/' table ' t body。parentnode。替换子项(div。第一个孩子。第一个孩子，tbody)}从MSDN上记录上看col、colGroup、frameset、html、head、style、table、tfoot、tHead、title和tr的innerHTML都是只读的(IE6-IE9)。在col、colGroup、frameSet、HTML、head、style、table、tBody、tFoot、the、title和tr对象上，innerHTML属性是只读的。您可以使用文档.标题属性更改标题元素的值。要更改表、tFoot、tHead和tr元素的内容，请使用动态构建表中描述的表对象模型。但是，要更改特定单元格的内容，可以使用内部HTML .