<!DOCTYPE?html>
<html>
?<head>
??<title>?new?document?</title>??
??<meta?http-equiv="Content-Type"?content="text/html;?charset=gbk"/>???
??<script?type="text/javascript">?
??????var?num=3;
??????window.onload?=?function(){
??????????var?list=document.getElementsByTagName("tr");
??????????for(i=0;i<list.length;i++){
??????????????modifybc(list[i]);
??????????}
?}
?????function?modifybc(obj){
?????????obj.onmouseover=function(){obj.style.backgroundColor="#f2f2f2";}
?????????obj.onmouseout=function(){obj.style.backgroundColor="#fff";}
?????}
??????//?編寫一個函數，供添加按鈕調用，動態在表格的最后一行添加子節點；
??????function?add(){
????????if(num<10){
????????????studentId="xh00"+num;
????????}else?if(num<100){
????????????studentId="xh0"+num;
????????}else{
????????????studentId="xh"+num;
????????}
????????studentName="第"+i+"位學生"
????????var?tb=document.getElementById("table");
????????var?tr=createElement("tr");
????????var?td=createElement("td");
????????td.innerHTML=studentId;
????????tr.appendChild(td);
????????var?td2=createElement("td");
????????td2.innerHTML=studentName;
????????tr.appendChild(td2);
????????var?td3=createElement("td");
????????var?a=document.createElement("a");
????????a.href="javascript:;"
????????a.onclick=del(this);
????????a.innerHTML="刪除";
????????td3.appendChild(a);
????????tr.appendChild(td3);
????????tb.appendChild(tr);
??????}
????function?del(obj){
????????var?tr=obj.parentNode.parentNode;
????????tr.parentNode.removeChild(tr);
????????}
??</script>?
?</head>?
?<body>?
???<table?border="1"?width="50%"?id="table">
???<tr>
<th>學號</th>
<th>姓名</th>
<th>操作</th>
???</tr>??
???<tr>
<td>xh001</td>
<td>王小明</td>
<td><a?href="javascript:;"?onclick="del(this)">刪除</a></td>???<!--在刪除按鈕上添加點擊事件??-->
???</tr>
???<tr>
<td>xh002</td>
<td>劉小芳</td>
<td><a?href="javascript:;"?onclick="del(this)">刪除</a></td>???<!--在刪除按鈕上添加點擊事件??-->
???</tr>??
???</table>
???<input?type="button"?value="添加一行"?onclick="add();"/>???<!--在添加按鈕上添加點擊事件??-->
?</body>
</html>
2015-09-28
進入瀏覽器中的開發者工具看看有沒有報錯信息，把報錯信息貼出來