innerHTML 错误（转载）

在用 Javascript 更改 HTML 代码的时候，经常会用到某个对象的 innerHTML。在读写标签内的代码或字符串时非常方便。

但 IE 对这个属性的支持不太好，经常容易报出 “未知的运行时错误”，而同样的操作，在 FireFox 和 Opera 下面就都没问题。

到百度和 Google 查了下，发现是 IE 浏览器下，对 <table>、<tbody> 和 <tr> 等标签的 innerHTML 属性进行写操作时会报错。

应该是 IE 处理不当造成的。

目前没有很好的解决办法，只能采取改变 HTML 结构的方式，也就是说，不要对 <table> 等标签应用这个属性，改为对 <div>、<span> 和 <p> 等标签，就没问题了。

比如，运行下面的代码会报错：

<table border="0" cellspacing="0" cellpadding="0" id="Container">
<tr>
<td>Hello Leakon!</td>
</tr>
</table>
<script type="text/javascript">
document.getElementById('Container').innerHTML = '<tr><td>Good morning!</td></tr>';
</script>

改变一下实现方式，就没问题了：

<div id="Container">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>Hello Leakon!</td>
</tr>
</table>
</div>
<script type="text/javascript">
document.getElementById('Container').innerHTML = '<table border="0" cellspacing="0" cellpadding="0"><tr><td>Good morning!</td></tr></table>';
</script>

<!-- You can start editing here. -->

One Response to “设置 innerHTML 属性 导致 未知的运行时错误 IE bug”

<script type="text/javascript"></script>