各位老師我是想：【點擊添加可以添加一行，刪除就刪除當(dāng)前行】實際是：【只能刪除寫在文檔里的<tr>,動態(tài)添加的就不行】<!DOCTYPE?html>
<html>
?<head>
??<title>?new?document?</title>??
??<meta?charset="UTF-8"/>??
??<style?type="text/css">
?? *{
?? font-family:Microsoft?YaHei;
?? }
?? #table{
?? background:?#fff;
?? margin:0;
?? border:0;
?? border-collapse:collapse;
?? }
?? #table?td{
?? border:solid?#ccc?1px;
?? }
?? #table?th{
?? border:solid?#999?2px;
?? }
?? #btn{
?? border:0;
?? width:?80px;
?? height:?25px;
?? background:#999;
?? color:?#fff;
?? cursor:?pointer;
?? }
?? .deletass{
?? color:#f60;
??????cursor:?pointer;
?? }
?? .div{
?? margin-top:?5px;
?? }
?? .div?>?*{
?? float:?left;
?? margin:0?3px;
?? }
??</style>
??<script?type="text/javascript">?
??function?addEventOnload(func){
????var?oldonload?=?window.onload;
????if(typeof?window.onload?!=?"function"){
??????window.onload?=?func;
????}else{
??????window.onload?=?function(){
????????oldonload();
????????func();
??????}
????}
??}
????function?addtr(){
???? var?table?=?document.getElementById("table").lastChild;/*找到表格*/
???? var?new_tr?=?document.createElement("tr"); /*創(chuàng)建tr*/
????
???? /**?學(xué)號??**/
???? var?num?=?document.getElementById("num"); /*獲取學(xué)號id*/
???? var?num_txt?=?parseInt(num.value); /*必須為整數(shù)*/
??????if(num_txt?<?10?&&?num_txt?>=?0){
????????num_txt?=?"0"+num_txt;
??????}
??????if(num_txt?>=?0){??????????????????????/*限制必須輸入學(xué)號*/
????????var?new_tx_a?=?document.createTextNode(num_txt);/*創(chuàng)建文本節(jié)點，追加學(xué)號*/
??????}else{
????????alert("請輸入正確學(xué)號!");
????????return?false;
??????}
???? var?new_td_a?=?document.createElement("td");/*新建td儲存學(xué)號*/
???? new_td_a.appendChild(new_tx_a); /*賦予學(xué)號*/
???? new_tr.appendChild(new_td_a); /*追加到tr*/
???? /**?姓名??**/
???? var?name?=?document.getElementById("name"); /*獲取姓名*/
??????var?name_txt?=?name.value;
???? if(name_txt.length?<=?16){ /*限制名字?jǐn)?shù)*/
????????var?new_tx_b?=?document.createTextNode(name_txt);
???? }else{
???? alert("姓名不能超過16個字，請重新輸入");
????????return?false;
???? }
???? var?new_td_b?=?document.createElement("td"); /*新建td儲存姓名*/
???? new_td_b.appendChild(new_tx_b); /*賦予姓名*/
???? new_tr.appendChild(new_td_b); /*追加到tr*/
???? /*添加刪除按鈕*/
???? var?new_td_c?=?document.createElement("td"); /*新建td儲存刪除按鈕*/
???? var?new_a?=?document.createElement("a");
???? var?new_a_txt?=?document.createTextNode("刪除");
???? new_a.appendChild(new_a_txt); /*追加文本*/
??????new_a.setAttribute("class","deletass");
???? new_td_c.appendChild(new_a); /*追加到td*/
??????new_tr.appendChild(new_td_c);?????????/*追加到tr*/
??????/*追加到原有行下面*/
??????table.appendChild(new_tr);
????}
?????
????
/*********************************************************************************************************************/??? ?
?????//?創(chuàng)建刪除函數(shù)
????function?deleteel(){
??????var?a_link?=?table.getElementsByClassName("deletass");
??????for(var?j?=?0;?j<a_link.length;?j++){
????????a_link[j].onclick?=?function(){
????????????var?table?=?document.getElementById("table").lastChild;
????????????var?x?=?table.removeChild(this.parentNode.parentNode);
????????}
??????}
????}
?????
????function?demo(){
??????var?bbt?=?document.getElementById("bbt");
??????bbt.onclick?=?function(){
????????var?table?=?document.getElementById("table").getElementsByTagName("tr");
????????alert(table.length);
??????}
????}
/*********************************************************************************************************************/
addEventOnload(deleteel);
addEventOnload(demo);
??</script>?
?</head>?
?<body>?
???<table?border="1"?width="50%"?id="table">
???<tr>
<th>學(xué)號</th>
<th>姓名</th>
<th>操作</th>
???</tr>??
???<tr>
<td>xh001</td>
<td>王小明</td>
<td><a?class="deletass">刪除</a></td>???<!--在刪除按鈕上添加點擊事件??-->
???</tr>
???<tr>
<td>xh002</td>
<td>劉小芳</td>
<td><a?class="deletass">刪除</a></td>???<!--在刪除按鈕上添加點擊事件??-->
???</tr>??
???</table>
???<div?class="div">
??? ???<span>請輸入相關(guān)信息:</span>
???<input?type="text"?name=""?id="num"?value="學(xué)號"?size="8">
???<input?type="text"?name=""?id="name"?value="姓名"?size="8">
???<input?type="button"?value="添加一行"?id="btn"?onclick?=?"addtr()"/>???<!--在添加按鈕上添加點擊事件??-->
???????<input?type="button"?name=""?id="bbt"?value="click">
???</div>
?</body>
</html>
關(guān)于js的小問題吧！有時間的老師同學(xué)來看看
開心的山羊
2016-07-28 22:56:53
