<!DOCTYPE html> <html> <head> <title></title> <script type="text/javascript"> window.onload=function(){ document.getElementById("btn_ID").onclick=function(){ /* alert("213");*/ //获取文本框的值 var nameValue=document.getElementById("userid").value; var EValue=document.getElementById("EID").value; var PhoneValue=document.getElementById("PhoenID").value; // alert(EValue); //获取td var nameTD=document.createElement("td"); var nameText=document.createTextNode(nameValue); nameTD.appendChild(nameText); var ETD=document.createElement("td"); var EText=document.createTextNode(EValue); ETD.appendChild(EText); var PhoneTD=document.createElement("td"); var PhoneText=document.createTextNode(PhoneValue); PhoneTD.appendChild(PhoneText); var DelTD=document.createElement("td"); var aElement=document.createElement("a"); aElement.setAttribute("href","deleteEmp?id="+nameValue); var DelText=document.createTextNode("删除"); aElement.appendChild(DelText); DelTD.appendChild(aElement); //增加tr 把td增加到tr上 var tr=document.createElement("tr"); tr.appendChild(nameTD); tr.appendChild(ETD); tr.appendChild(PhoneTD); tr.appendChild(DelTD); //吧tr增加到table上 var tableElement=document.getElementById("tableExample"); tableElement.appendChild(tr); //删除 aElement.onclick=function(){ //使网页链接失效 return DelTr(aElement); } function DelTr(a){ var name= a.parentNode.parentNode.firstChild.firstChild.nodeValue; //alert(name); var flag=window.confirm("你真的要删除"+name+"这行么?"); if(!flag){ return false; } //获取tr的parent var TrParent=aElement.parentNode.parentNode.parentNode; //获取tr var Tr=aElement.parentNode.parentNode; //删除 TrParent.removeChild(tr); //网页链接失效 return false; } } } </script> </head> <body> 添加用户:<br/> 用户名:<input type="text" name="user"id="userid"/> Email:<input type="text" name="Ename" id="EID"value="qinxia@so.com"/> 电话:<input type="text" name="Phonename" id="PhoenID"/><br/> <input type="button"value="提交"id="btn_ID"/> <table border="1" id="tableExample"> <tr><td>用户名</td><td>Email</td><td>电话</td><td>删除</td></tr> </table> </body> </html>