IE9 createElement并在set操作上设置innerHTML drop tags?

时间:2011-11-11 16:41:32

标签: javascript dom internet-explorer-9

不确定我是否遗漏了一些明显的东西,因为这是我第一次尝试使用原始DOM apis(而不是通过jQuery等)。

考虑以下代码,我用document.createElement手动创建TBODY,然后设置它的innerHTML。

<table id="myTable">
</table>

<script type='text/javascript'>
    var row = "<tr><td><span>col1</span></td><td>col2</td></tr>";
    var render = function(){
        var table = document.getElementById('myTable');
        var tbody = document.createElement('tbody');
        tbody.innerHTML = row;
        table.appendChild(tbody);

        console.log(tbody.innerHTML);
    };

    $(document).ready(function(){
        render();
    });
</script>

在Chrome和FF中,这就像我想的那样 - 给我一张桌子等等。但是,在IE9中,似乎内部HTML中的第一个HTML标签被删除了。即,而不是

<TR><TD><SPAN>col1</SPAN></TD><TD>col2</TD></TR>

我得到了

<SPAN>col1</SPAN></TD><TD>col2</TD></TR>

以上的JSFiddle:http://jsfiddle.net/pAJwu/

知道这里发生了什么吗?

1 个答案:

答案 0 :(得分:7)

IE版本9不支持在某些元素上设置innerHTMLHere's why;该链接还包括可能的解决方法。