appendChild
语法:parent.appendChild(child)
parent: 调用者,父节点来调用
child:需要添加的那个孩子。
作用:把child添加到parent的孩子的最后面。
var demo = document.getElementById("demo");
var box = document.getElementById("box");
box.appendChild(demo);
insertBefore
语法:parent.appendChild(child)
parent: 调用者,父节点来调用
child:需要添加的那个孩子。
作用:把child添加到parent的孩子的最后面。
var ul = document.getElementById("list");
var li = document.createElement("li");
li.innerHTML = "骥骥";
//就是添加到子节点的最前面。
ul.insertBefore(li, ul.children[0]);
克隆节点
语法:var newNode = node.cloneNode(deep)
功能:在内存中克隆一份节点
参数:deep
false:默认值:是浅复制,只会复制标签,节点本身,不会复制节点的孩子。
true:深度复制,会复制标签,还会复制标签的所有内容 --- 常用
克隆出来的节点跟原来的节点没有关系了,修改了也不会相互影响。
如果克隆的节点带了id,我们需要给id重新设置一个值,不让id冲突
删除节点
语法:parent.removeChild(child);
功能:由父盒子调用,删除里面的一个子元素。
【案例:祝愿墙】 --- ondblclick:双击的时候触发