不用this就不對(duì) 為什么呢請(qǐng)大家?guī)蛶兔匆豢?/h1>
<!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(){
??????????????????
?????//?鼠標(biāo)移動(dòng)改變背景,可以通過給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來改變所在行背景色。
?????????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";}
?????????}
??
?????
??
??}
?????
??????//?編寫一個(gè)函數(shù),供添加按鈕調(diào)用,動(dòng)態(tài)在表格的最后一行添加子節(jié)點(diǎn);
?????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);
?????}
??????
?????
?????//?創(chuàng)建刪除函數(shù)
?????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>學(xué)號(hào)</th>??<th>姓名</th>??<th>操作</th>????</tr>?????<tr>??<td>xh001</td>??<td>王小明</td>??<td><a?href="javascript:remove1();"?>刪除</a></td>???<!--在刪除按鈕上添加點(diǎn)擊事件??-->????</tr>????<tr>??<td>xh002</td>??<td>劉小芳</td>??<td><a?href="javascript:remove2();"?>刪除</a></td>???<!--在刪除按鈕上添加點(diǎn)擊事件??-->????</tr>?????</table>????<input?type="button"?value="添加一行"?onclick="add()"?/>???<!--在添加按鈕上添加點(diǎn)擊事件??-->?</body></html>
<!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(){ ?????????????????? ?????//?鼠標(biāo)移動(dòng)改變背景,可以通過給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來改變所在行背景色。 ?????????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";} ?????????} ?? ????? ?? ??} ????? ??????//?編寫一個(gè)函數(shù),供添加按鈕調(diào)用,動(dòng)態(tài)在表格的最后一行添加子節(jié)點(diǎn); ?????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); ?????} ?????? ????? ?????//?創(chuàng)建刪除函數(shù) ?????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>學(xué)號(hào)</th>??<th>姓名</th>??<th>操作</th>????</tr>?????<tr>??<td>xh001</td>??<td>王小明</td>??<td><a?href="javascript:remove1();"?>刪除</a></td>???<!--在刪除按鈕上添加點(diǎn)擊事件??-->????</tr>????<tr>??<td>xh002</td>??<td>劉小芳</td>??<td><a?href="javascript:remove2();"?>刪除</a></td>???<!--在刪除按鈕上添加點(diǎn)擊事件??-->????</tr>?????</table>????<input?type="button"?value="添加一行"?onclick="add()"?/>???<!--在添加按鈕上添加點(diǎn)擊事件??-->?</body></html>
2019-04-27
用a[i]的話,你期望的是,你給每個(gè)標(biāo)簽的事件里添加的function里找的a[i]是這個(gè)標(biāo)簽本身。
實(shí)際上是錯(cuò)誤的,他會(huì)先去看看i是幾,然后再找a[i]是哪個(gè)標(biāo)簽,然而i是一直在變化的變量而不是常量。在for循環(huán)結(jié)束后,i的值將會(huì)等于數(shù)組的長(zhǎng)度即a.length。此時(shí),每個(gè)標(biāo)簽當(dāng)鼠標(biāo)移上去后,他會(huì)執(zhí)行你之前循環(huán)添加的function,去找a[i]是哪個(gè),然后改變它的背景顏色。他找到a[a.length]發(fā)現(xiàn)這個(gè)標(biāo)簽并不存在(數(shù)組下標(biāo)最大值為a.length-1),所以【
a[i].style.backgroundColor=
"#f2f2f2"】這句話就無效了。