问答详情
源自：9-22 编程练习

为什么this替换成tr[i]就改变不了颜色？晕了，跪求指正。

      window.onload = function(){              
     // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
        var tr=document.getElementsByTagName("tr"); 
        var rowNum=tr.length;
tr[]
        for(var i=0;i<rowNum;i++){
           tr[i].onmouseover=function(){this.style.backgroundColor="#f2f2f2";}
           tr[i].onmouseout=function(){this.style.backgroundColor="#fff";} 
        }
    }

为什么不能用tr[i]代替this？

for循环里面的函数是window.onload那个函数的子函数，那么子函数应该可以从父函数哪里获取tr[i]的值吧。

看了好多答案，搞晕了，望指正，跪求！！！

提问者：Snail_N 2015-02-27 01:01

个回答

  • jf
    2015-02-27 09:53:03
    已采纳

    通过console 或 alert 进行调试，打印i的值就知道，for循环完毕时，i的值跟你要的索引是不一样的。


    window.onload = function(){
    // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
    var tr=document.getElementsByTagName("tr");
    var rowNum=tr.length;
    for(var i=0;i<rowNum;i++){
	tr[i].index = i;	//给当前对象添加属性记录索引值
	tr[i].onmouseover=function(){
		console.log(i);	//鼠标移入的时候，for循环已遍历完，i值不是你要的索引，而是rowNum 或 其他地方重新给i的赋值
		tr[this.index].style.backgroundColor="#f2f2f2";
	}
	tr[i].onmouseout=function(){
		tr[this.index].style.backgroundColor="#fff";
	}
    }
}


    1