HTMl 添加

来源:互联网 发布:unity3d无缝地图 编辑:程序博客网 时间:2024/06/03 15:17


<script>function tj() {var xj_tr = document.createElement("tr");var shuju_name = document.getElementById("a_name");var shuju_age = document.getElementById("a_age");var shuju_buil = document.getElementById("a_buil");if(isNaN(shuju_age.value) == false) {var ipp = document.getElementById("ip");ipp.innerText = "";var tianjia_name = document.createElement("td");var tianjia_age = document.createElement("td");var tianjia_buil = document.createElement("td");var tianjia_shanchu = document.createElement("td");tianjia_name.innerText = shuju_name.value;tianjia_age.innerText = shuju_age.value;tianjia_buil.innerText = shuju_buil.value;var shanchu = document.createElement("button");shanchu.innerText = "刪除";shanchu.onclick = function() {this.parentNode.remove();}tianjia_shanchu.appendChild(shanchu);xj_tr.appendChild(tianjia_name);xj_tr.appendChild(tianjia_age);xj_tr.appendChild(tianjia_buil);xj_tr.appendChild(shanchu);var z = document.getElementById("z_table");z.appendChild(xj_tr);} else {var ipp = document.getElementById("ip");ipp.innerText = "年齡輸入不對";}}</script>


<font>姓名 </font><input type="text" id="a_name" /><font>年齡</font><input type="text" id="a_age" /><font>生日</font><input type="text" id="a_buil" /><input type="button" value="添加" onclick="tj()" /><br /><p id="ip"></p><br /><table border="1" id="z_table"><tr><th width="100px">姓名</th><th width="100px">年齡</th><th width="100px">生日</th><th width="100px">删除</th></tr></table>