函数嵌套?

来源:9-22 编程练习

kevine099

2016-04-15 18:49

关于鼠标移动改变背景的方法:

1.慕课标准答案:

window.onload = function(){
		Highlight();
	 }
function Highlight(){
		var tbody = document.getElementById('table').lastChild;	
		trs = tbody.getElementsByTagName('tr');   
		for(var i =1;i<trs.length;i++){
			trs[i].onmouseover = function(){
				this.style.backgroundColor ="#f2f2f2";
			} 
			trs[i].onmouseout = function(){
				this.style.backgroundColor ="#fff";
			} 
		}  
	 }
2.大神同学的代码:
window.onload = function(){
          var tr=document.getElementsByTagName("tr");
          for(var i= 0;i<tr.length;i++)
          {
              bgcChange(tr[i]);
          }
function bgcChange(obj)
     {
        obj.onmouseover=function(){
            obj.style.backgroundColor="#f2f2f2";
        }
        obj.onmouseout=function(){
            obj.style.backgroundColor="#fff";
        }
	 }
前两种都能运行成功,有效果。
3.我的代码:
window.onload = function(){
          hightLight();
	 }
	 function hightLight(){
	 	var tr=document.getElementsByTagName("tr");
	 	for(i=0;i<tr.length;i++){
	 		tr[i].onmouseover=function(){
	 			
	 			tr[i].style.backgroundColor="red";
	 		}
	 		tr[i].onmouseout=function(){
	 			tr[i].style.backgroundColor="#fff";
	 		}
	 	}
	 }
运行报错,说style是undefined。

不难对比得出,主要是tr[i].onmouseover=function(){ }这个函数中有所不同。1网站给的代码是用了this,暂且不论,2大神给的代码是传递了tr[i]进来颜色改变的函数,只不过换了个名字叫obj,但是感觉实质和我的代码一样的呀,为什么我的就运行不成功呢??

写回答 关注

2回答

  • Jabin_
    2016-04-16 14:54:05

       window.onload = function(){

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

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

              {

                  tr[i].onmouseover=function(){

                this.style.backgroundColor="#f2f2f2";

                    }

                tr[i].onmouseout=function(){

                this.style.backgroundColor="#fff";

                    }

             }


        }

    这样就可以了

    新人沈琦斌 回复yyvan

    不知道你现在弄明白this 和obj以及tr[i]的区别了没?我现在也一点都不懂,能不能给我讲一讲?谢谢你

    2016-04-25 00:31:19

    共 2 条回复 >

  • 卡马克
    2016-04-15 21:39:37

    for循环的数组下角标从零开始,最后一位是tr[i].length-1,tr[i].length是不存在的,所以会提示未定义

JavaScript进阶篇

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

468194 学习 · 21891 问题

查看课程

相似问题