window.onload = function(){
// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
var hh=document.getElementsByTagName("tr");
for(var i=0;i<hh.length;i++)
{
hh[i].onmouseover=function(){
this.style.backgroundColor= "#f2f2f2";
}
hh[i].onmouseout=function(){
this.style.backgroundColor= "#fff";
} } }
为什么这段代码里，改背景色时用this就成功了，可是用 hh[i]不行？
2015-11-24
这个问题，如果你js基础不好或刚入门的话，给你解释估计你也会难于理解。。我试着解释一下吧，理解了更好，不理解你再问我。。
window.onload = function(){
// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
var hh=document.getElementsByTagName("tr");
for(var i=0;i<hh.length;i++)
{
hh[i].onmouseover=function(){
this.style.backgroundColor= "#f2f2f2";
}
hh[i].onmouseout=function(){
this.style.backgroundColor= "#fff";
}
}
}这几段代码的意思是，在页面加载完毕之后，选出来所有的tr元素，由于所有的tr元素是放在一个nodeList里（你可以认为是一个数组），所以可以循环它，来给每个tr绑定mouseover和mouseout事件。。
这些你肯定都理解。。
那为什么使用hh[i]就不行，使用this就可以了呢？
因为，循环执行的很快，一瞬间就执行完毕了，所以当你触发mouseover和mouseout事件时，循环早就执行完毕了，执行完毕时，此时 i = hh.length，所以，你使用 hh[i] 也就是 hh[hh.length] 并不能取出任何元素（返回undefined），那么你要实现的目标“给每个tr绑定mouseover和mouseout事件”显然是实现不了的。。
但是为什么this就可以了呢？因为不论如何，事件处理函数中的this对象始终指向每一个tr，所以它就可以。。
举报
