js dom写的增加和删除
用js dom写的一个简单的增删，用的都是基础的知识
html标签用的很少，都是用js生成的
-------------------------------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
table{
width:200px;
height:10px;}
</style>
</head>
<script language="javascript">
//定义一个函数方便调用
function tian(){
//生成一个table标签
var table=document.createElement("table");
//定义border属性
table.border="1px";
//生成tr
var tr=document.createElement("tr");
//查找html中的input标签
var tex=document.getElementsByTagName("input");for(i=0;i<4;i++){
//生成文本
var text=document.createTextNode(tex[i].value);
//生成td
var td=document.createElement("td");
//把td文本后置到text前
td.appendChild(text);tr.appendChild(td);
}
table.appendChild(tr);
document.getElementById("d1").appendChild(table);
}
function shan(){
var table=document.getElementsByTagName("table");
var div=table[0].parentNode;
//删除最后的table
var sha=div.removeChild(table[table.length-1]);
}
</script>
<body>
<form>
姓名：<input type="text" name="xing" value="姓名"/>
性别:<input type="text" name="bie" value="性别"/>
电话：<input type="text" name="dian"value="电话"/>
邮箱:<input type="text" name="you" value="邮箱"/>
<input type="button" value="添加" onclick="tian()"/>
<input type="button" value="删除" onclick="shan()" />
</form>
<div id="d1">
</div>
</body>
</html>
