为什么只有第三行是颜色发生变化的呢？

源自：9-22 编程练习

为什么只有第三行是颜色发生变化的呢？

window.onload = function(){

var tr=document.getElementsByTagName("tr");

for(i=0;i<tr.length;i++){

tr[i].onmouseenter=function(){tr[i].style.background="#f2f2f2";}

tr[i].onmouseleave=function(){tr[i].style.background="#fff";}

}

}

提问者：慕侠4705823 2018-01-23 15:40

个回答

liadrinz

2018-02-28 15:51:44

已采纳

楼上完全正确，可以用以下方案解决：
方案一：用let声明变量i，即for(i=0;i<tr.length;i++)改为for(let i=0;i<tr.length;i++)
方案二：用自执行匿名函数把闭包包装起来，
只需将for循环体里面的内容改为：
```
(function(num){
    tr[num].onmouseenter=function(){tr[num].style.background="#f2f2f2";}
    tr[num].onmouseleave=function(){tr[num].style.background="#fff";}
    })(i)
```
1
慕勒7123956

2018-01-25 11:23:05

因为你给每个tr都绑定了tr[i]的样式发生变化，它们的i是同一个变量。当你把鼠标以上tr时，这时候数组循环是肯定已经完成了的。这时候的i其实就是tr.length.

1