<!DOCTYPE?html>
<html>
?<head>
??<title>?new?document?</title>??
??<meta?http-equiv="Content-Type"?content="text/html;?charset=gbk"/>???
??<script?type="text/javascript">?
??
??????window.onload?=?function(){
??????????????????
?????//?鼠標移動改變背景,可以通過給每行綁定鼠標移上事件和鼠標移除事件來改變所在行背景色。
?????????var?a=document.getElementsByTagName("tr");
?????????
?????????for(var?i=0;i<a.length;i++){
?????????????
?????????????a[i].onmouseover=function(){a[i].style.backgroundColor="#f2f2f2";}
?????????????a[i].onmouseout=function(){
?????????????a[i].style.backgroundColor="#fff";}
?????????}
??
?????
??
??}
?????
??????//?編寫一個函數，供添加按鈕調用，動態在表格的最后一行添加子節點；
?????function?add(){
?????????var?element=document.body.table;
?????????var?ele1=document.createElement("tr");
?????????var?ele2=document.createElement("td");
?????????var?ele3=document.createElement("td");
?????????var?ele4=document.createElement("td");
?????????ele2.innerHTML="添加行";
?????????element.appendChild(ele1);
?????????ele1.appendChild(ele2);
?????????ele1.appendChild(ele3);
?????????ele1.appendChild(ele4);
?????}
??????
?????
?????//?創建刪除函數
?????function?remove1(){
?????????removeChild(document.body.table.childNode[1]);
?????}
??????function?remove2(){
?????????removeChild(document.body.table.childNode[2]);
?????}??</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:remove1();"?>刪除</a></td>???<!--在刪除按鈕上添加點擊事件??-->????</tr>????<tr>??<td>xh002</td>??<td>劉小芳</td>??<td><a?href="javascript:remove2();"?>刪除</a></td>???<!--在刪除按鈕上添加點擊事件??-->????</tr>?????</table>????<input?type="button"?value="添加一行"?onclick="add()"?/>???<!--在添加按鈕上添加點擊事件??-->?</body></html>
2019-04-27
用a[i]的話，你期望的是，你給每個標簽的事件里添加的function里找的a[i]是這個標簽本身。
實際上是錯誤的，他會先去看看i是幾，然后再找a[i]是哪個標簽，然而i是一直在變化的變量而不是常量。在for循環結束后，i的值將會等于數組的長度即a.length。此時，每個標簽當鼠標移上去后，他會執行你之前循環添加的function，去找a[i]是哪個，然后改變它的背景顏色。他找到a[a.length]發現這個標簽并不存在（數組下標最大值為a.length-1），所以【
a[i].style.backgroundColor="#f2f2f2"】這句話就無效了。2019-03-20
...