a.appendChild(b) 追加标签 a是b的父级,将b追加到a中
追加标签 a.insertBefore(b,c); a是b和c的父级,在c前面插入b
删除标签 a.removeClild(b) a是b的父级,删除b标签
案例:
(1)html
<input type="text" id="txt">
<button id="btn">按钮</button>
<div id="box">
<p id="P1">这是第一个P <span id='close'>X</span></p>
</div>
(2)JavaScript
function abb(a){
return document.getElementById(a);
}
var p;
abb('btn').onclick=function(){
p=document.createElement('p');
p.innerHTML=abb('txt').value;
console.log(p);
// abb('box').appendChild(p);
abb('box').insertBefore(p,abb('box').children[0]);
// 追加标签 a.insertBefore(b,c); a是b和c的父级,在c前面插入b
}
abb('close').onclick=function(){
// abb('box').removeChild(this.parentNode);
this.parentNode.parentNode.removeChild(this.parentNode);
// 删除标签 a.removeClild(b) a是b的父级,删除b标签
}