在IE中无法在tbody上设置innerHTML [英] Can't set innerHTML on tbody in IE

问题描述

我有这样一张桌子：

<table>
<thead>
    <tr>
        <th colspan="1">a</th>
        <th colspan="3">b</th>
    </tr>
</thead>
<tbody id="replaceMe">
    <tr>
        <td>data 1</td>
        <td>data 2</td>
        <td>data 3</td>
        <td>data 4</td>
    </tr>
</tbody>
</table>

一个方法在ajax请求后返回以下内容：

and a method returns me the following after an ajax request:

<tr>
    <td>data 1 new</td>
    <td>data 2 new</td>
    <td>data 3 new</td>
    <td>data 4 new</td>
</tr>

我想更改innerHTML，如

I want to change the innerHTML like

document.getElementById('replaceMe').innerHTML = data.responseText;

但是，似乎IE无法在< tbody>上设置innerHTML ; 。任何人都可以帮我解决这个问题的简单解决方法吗？

However, it seems that IE can't set innerHTML on <tbody>. Can anyone help me with a simple workaround for this issue?

推荐答案

这是真的，tbody元素的innerHTML在IE中是readOnly

That is true, innerHTML on tbody elements is readOnly in IE

对于除以下内容之外的所有
对象，该属性是可读/写的，对于
，它是只读的： COL，COLGROUP，
FRAMESET，HEAD，HTML，STYLE，TABLE，
TBODY，TFOOT，THEAD，TITLE，TR。

The property is read/write for all objects except the following, for which it is read-only: COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR.

来源： http://msdn.microsoft .com / zh-CN / library / ms533897（VS.85）.aspx

你可以做这样的事情来解决它：

You can do something like this to work around it:

function setTBodyInnerHTML(tbody, html) {
  var temp = tbody.ownerDocument.createElement('div');
  temp.innerHTML = '<table>' + html + '</table>';

  tbody.parentNode.replaceChild(temp.firstChild.firstChild, tbody);
}

基本上它会创建一个临时节点，你可以注入一个完整的表。然后它从注入的表 tbody 替换 tbody >。如果证明它很慢，你可以通过缓存 temp 而不是每次都创建它来加快速度。

Basically it creates a temporary node into which you inject a full table. Then it replaces the tbody with the tbody from the injected table. If it proves to be slow, you could make it faster by caching temp instead of creating it each time.

这篇关于在IE中无法在tbody上设置innerHTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！