js拾遗:appendChild 添加移动节点

写js一年多了,一直以为自己很牛逼,开始写各种博文分享,昨天写了一篇《浅谈 IE下innerHTML导致的问题》在看了下面的评论,我才发现自己是多么无知。
于是我回头翻阅了下 MDN,Node.appendChild 里面一开始就明确说了,“如果该节点已经存在,则从当前父节点中删除,然后添加到新的父节点。”
简单来说就是移动当前节点的意思,所以昨天的代码里去掉 obox.innerHTML = ""; 即可全兼容。

来看个常见的例子:

1
2
var p = document.createElement("p");
document.body.appendChild(p);

这个是最常见的用法,创建 p 节点,添加到 body 的末尾。

1
2
var p1 = document.getElementById("p1");
document.body.appendChild(p1);

那这个代码的意思就是选择ID为 p1 的节点,移动到 body 的末尾。

简单说,就是把节点放到指定父节点的末尾,不论是新建的还是选取到的。

不过话说回来,innerHTML 在IE下确实存在bug,可是我没找到相关的文章,希望以后会有机会解开这个问题。

通过这个问题让我认识到自己是多么无知,确实该停下脚步,回头拾遗了。

这场战争结束后我就回老家结婚

posted @   楼教主  阅读(2332)  评论(1编辑  收藏  举报
编辑推荐:
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
阅读排行:
· 地球OL攻略 —— 某应届生求职总结
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· .NET周刊【3月第1期 2025-03-02】
· [AI/GPT/综述] AI Agent的设计模式综述
js output×
点击右上角即可分享
微信分享提示