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>
</head>
<body onload="ap()">
<script type="text/javascript">
function ap(){
var div= document.getElementById("divContent");
var table=document.createElement("table");
table.align="center";
table.border="1";
table.setAttribute("width","500");
table.height="100";
//document.body.appendChild(table);
div.appendChild(table);
var tr1= document.createElement("tr");
var td1=document.createElement("td");
td1.width="250";
var td2=document.createElement("td");
td2.width="250";
tr1.appendChild(td1);
tr1.appendChild(td2);
table.appendChild(tr1);
var input=document.createElement("input");
input.type="text";
input.size="20";
input.value="张三";
var text=document.createTextNode("姓名");
td1.appendChild(text);
td1.appendChild(input);
}
function del(){
/**
var div=document.getElementById("deleteElement");
document.body.removeChild(div);
*/
var table=document.getElementById("tb");
if(table!=null){
var parent= table.parentNode;
parent.removeChild(table);
}
}
</script>
<div id="divContent" style="border:1px solid red; width:700px;">
</div><br /><br />
<div id="deleteElement" style="border:1px solid red; width:700px;">
<table id="tb" border="2">
<tr>
<td>要删除的表格</td>
</tr>
</table>
</div>
<br /><br />
<input type="button" value="删除DIV中的表格" onclick="del()"/>
</body>
</html>
