改变行颜色,这样写为什么不行?

来源:9-22 编程练习

HSobin

2017-02-16 20:59

window.onload = function(){     

     // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。

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

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

            tr[i].onmouseover=function(){

            tr[i].style.backgroundColor="#f2f2f2";

            }

            tr[i].onmouseout=function(){

            tr[i].style.backgroundColor="#f2f2f2";

            }

        }

}


写回答 关注

3回答

  • 快飞吧_赵土豆
    2017-02-22 18:40:17
    已采纳

    alltr[i].onmouseover=function(){ this.style.backgroundColor = "#f2f2f2";}
    与alltr[i].onmouseover=function(){ alltr[i].style.backgroundColor = "#f2f2f2";}:
    后者无法改变颜色的原因在于,鼠标事件为触发事件,也就是说,是给每行添加一个触发事件,但是触发后执行的内容,是触发对象this颜色改变。
    先循环,添加事件后,此时i=3, 再发生触发,运行触发函数中内容,alltr[i]中的i为3,而不是触发对象。

    HSobin

    非常感谢

    2017-02-27 13:05:04

    共 1 条回复 >

  • qq_这是只仓鼠_0
    2017-02-25 23:08:17

    因为按照你写的 添加这个事件以后他会按照最后的结果也就是tr[i]去执行,这个i不会变成固定值,而是依然动态的,而FOR结束以后I肯定是3,所以所有的方法里都会变成tr[3],但是3里根本没有元素,所以控制台报错,也没有效果。

    HSobin

    非常感谢

    2017-02-27 13:05:18

    共 2 条回复 >

  • 慕村1994845
    2017-02-16 21:45:28

    先不说你代码对不对,你这两个颜色设置的一样,怎么看效果呢?

JavaScript进阶篇

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

468192 学习 · 21891 问题

查看课程

相似问题