innerHTML 引发“未知的运行时错误”

今天碰到这个极度郁闷的报错，搞了大半下午，才发现是ie的问题，忍不住大骂。例子是这样的：页面中有多处能出发菜单，并且菜单出现在触发点的旁边，为保证页面上不能同时显示两个以上的菜单，我的做法是隐藏一个div，用作菜单容器。

每个触发点根据实际情况在菜单容器里innerHTML各种html代码，再用appechChild方法把菜单续加到（其实就是剪切）到触发点的旁边。代码如下：

 <script type="text/javascript">
function product(obj){
 var menu = document.getElementById("abc");
 menu.style.display = "";
 menu.innerHTML = "产品的菜单";
 obj.parentNode.appendChild(menu);
}
function news(obj){  
 var menu = document.getElementById("abc");
 menu.style.display = "";
 menu.innerHTML = "新闻的菜单";
 obj.parentNode.appendChild(menu);
}
</script>
<div id="abc" style="border:1px solid #000; background:#eee; position:absolute; display:none; height:200px; font-size:12px; padding:1em"></div>
<p><input type="button" value="产品" onclick="product(this)"></p>
<p style="margin-left:130px"><input type="button" value="新闻" onclick="news(this)"></p>

上面两个函数仅仅2个中文字符不同，但触发其中任一个函数，再触发第二个，就会报“未知的运行时错误”，相当诡异。左看右看，都没看出什么破绽，RPWT？No way！即刻询问谷歌，答曰“innerHTML 对下面的对象只读： COL,COLGROUP,FRAMESET,HTML,STYLE,TABLE,TBODY,TFOOT,THEAD,TITLE,TR”，谷歌似乎也不太清楚，真晕，这个让人费神的破IE。谷歌虽然没有爽快地告诉我答案，却也才知道原来ie下还有innerHTML属性为只读的元素，瀑布汗~~~，根据这一启发，修改了几次页面的标签，有了一个惊人的发现，只要把触发点父节点p元素改用div元素，程序立马正常！hoho~~~，原来div与p除了语义不同，其作为文档对象（xml节点）的属性也不同。无语~