                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

为什么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

源自：JavaScript进阶篇 9-22

关注问题我要回答

1582

操作

收起

1 回答

jf
2015-02-27

通过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 回复有任何疑惑可以回复我~

收起回答

Snail_N 提问者

谢谢你！

2015-02-27 回复有任何疑惑可以回复我~

Snail_N 提问者

已经找到问题是作用域链和闭包不理解的问题，需要进一步消化一下，谢谢你的帮助。

2015-02-27 回复有任何疑惑可以回复我~

chenbowen

谢谢！

2015-04-22 回复有任何疑惑可以回复我~

0/150

提交

取消

JavaScript进阶篇

参与学习 468189 人
解答问题 21891 个

本课程从如何插入JS代码开始，带您进入网页动态交互世界

进入课程

本课相似问答

2 回答为什么在改变背景函数中将this替换成trs[i]就改变不了行颜色了？求解

1 回答为什么不能用tr[i].setAttribute('onmouseover','changeColor(this)');来改变颜色

2 回答为什么改变不了背景颜色？

6 回答为什么把this换成oList[i]就不行？

1 回答这道题，在改背景颜色的函数中，为什么this改为trList[i]就失效了？

搜索更多本课相关问答

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

我要回答关注问题

热搜

最近搜索清空

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

1 回答

本课相似问答

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