首页 > 代码库 > 20、formAdd,javascript实习动态添加
20、formAdd,javascript实习动态添加
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><style type="text/css"> #userTable{ border: 1px solid black; } tr,td{ border: 1px solid black; margin: 0px; }</style></head><body> 姓名: <input type="text" name="name" id="name">   电话: <input type="text" name="del" id="del">   年龄: <input type="text" name="age" id="age"> </br> </br> <input type="button" onclick="add()" value="http://www.mamicode.com/添加"> <table id="userTable"> <tr> <td>姓名</td> <td>电话</td> <td>年龄</td> <td>操作</td> </tr> <tr> <td>李钟硕</td> <td>18341893451</td> <td>28</td> <td><a href="javascript:void(0)" onclick="del(this)">delete</a></td> </tr> <tr> <td>高俊熙</td> <td>18341895832</td> <td>26</td> <td><a href="javascript:void(0)" onclick="del(this)">delete</a></td> </tr> </table></body><script type="text/javascript"> function add() { var name = document.getElementById("name").value; var del = document.getElementById("del").value; var age = document.getElementById("age").value; var tr = document.createElement("tr"); tr.innerHTML = "<td>" + name + "</td><td>" + del + "</td><td>" + age + "</td><td><a href=‘javascript:void(0)‘ onclick=‘del(this)‘>delete</a></td>"; document.getElementById("userTable").appendChild(tr); } function del(a) { a.parentNode.parentNode.parentNode.removeChild(a.parentNode.parentNode); }</script></html>
20、formAdd,javascript实习动态添加
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。