js、动态添加删除
运用下边几个标签实现动态创建标签，删除标签，大家要考虑的是内存里边发生的情况
createElemen创建元素；
appendChild追加元素；
parentNode返回指定节点的父节点；
removeChild删除指定的元素节点。
第一步 HTML写法
<html>
<head>
<title>动态创建元素</title>
<meta charset="utf-8">
</head>
<body>
<div id="box">
</div>
<input type="text" id="txt">
<input type="button" id="btn" value="点击">
</body>
</html>css设置属性
#box{
width：200px;
height:200px;
border:1px solid #ccc;
}动态创建、删除元素
//获取元素的ID
var oBox=document.getElementById("box");
var oTxt=document.getElementById("txt");
var oBtn=document.getElementById("btn");
//添加
oBtn.onclick=function(){
var pp =document.createElement("p");
var del=document.createElement("input");
del.type="button";
del.value="删除";
wenben=oTxt.value;
pp.innerHTML=wenben;
pp.style.color="red";
oBox.appendChild(pp);
pp.appendChild(del);
//删除
del.onclick=function(){
pp.parentNode.removeChild(pp);
}
oTxt.value="";
}
考虑一下正常的思路，我们通常是通过for循环来添加删除、但是那样肯定是执行不了代码的！
它为什么能把元素给删除掉呢，是因为咱们创建元素的时候就已经给他把那个click方法给添加进那个删除元素里边去了！
看一下下边的代码你就能明白了吧！
//获取元素的ID
var oBox=document.getElementById("box");
var oTxt=document.getElementById("txt");
var oBtn=document.getElementById("btn");
//添加
oBtn.onclick=function(){
var pp =document.createElement("p");
var del=document.createElement("input");
del.type="button";
del.value="删除";
wenben=oTxt.value;
pp.innerHTML=wenben;
pp.style.color="red";
//删除
del.onclick=function(){
pp.parentNode.removeChild(pp);
}
oTxt.value="";
oBox.appendChild(pp);
pp.appendChild(del);
}就是这个样子！有点眼熟，喜欢的话，点一下赞，谢谢！
下边附上演示地址。。。
http://runjs.cn/detail/xwqcq6on
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。