写js一年多了,一直以为自己很牛逼,开始写各种博文分享,昨天写了一篇《浅谈 IE下innerHTML导致的问题》在看了下面的评论,我才发现自己是多么无知。
于是我回头翻阅了下 MDN,Node.appendChild 里面一开始就明确说了,“如果该节点已经存在,则从当前父节点中删除,然后添加到新的父节点。”
简单来说就是移动当前节点的意思,所以昨天的代码里去掉 obox.innerHTML = ""; 即可全兼容。
来看个常见的例子:
var p = document.createElement("p"); document.body.appendChild(p);
这个是最常见的用法,创建 p 节点,添加到 body 的末尾。
var p1 = document.getElementById("p1"); document.body.appendChild(p1);
那这个代码的意思就是选择ID为 p1 的节点,移动到 body 的末尾。
简单说,就是把节点放到指定父节点的末尾,不论是新建的还是选取到的。
不过话说回来,innerHTML 在IE下确实存在bug,可是我没找到相关的文章,希望以后会有机会解开这个问题。
通过这个问题让我认识到自己是多么无知,确实该停下脚步,回头拾遗了。