ruirui_1996 2017-10-03 03:32 采纳率: 100%
浏览 3029
已采纳

【JavaScript】一个简单的隔行变色,鼠标移入移出的问题

为什么此处只能用this,如果把this换成oLis就是错的?

 <script type="text/javascript">
    var oLi = document.getElementsByTagName("li");
    for (var i = 0; i < oLi.length; i++) {
        var oLis = oLi[i];
        i % 2 === 0 ? (oLis.className = "c1" , oLis.old = "c1") : (oLis.className = "c2", oLis.old = "c2");
        oLis.onmouseover = function () {
            this.className = "c3"; //为什么此处只能用this,如果把this换成oLis就是错的?
        };
        oLis.onmouseout = function () {
            this.className = this.old;
        };
    }
</script>
  • 写回答

8条回答 默认 最新

  • 请叫我班长 2017-10-03 07:49
    关注

    首先说下this。this是指向事件的调用者。
    然后

      var oLi = document.getElementsByTagName("li"); 
    

    获取到的是伪数组。所有的li元素都放入oLi变量里面了。
    其次for循环语句 里面的

      var oLis = oLi[i];
    

    是把当前循环的 i 作为变量oLi的索引值,找到oLi伪数组当前执行的li元素。for每循环一次都会创建一个oLis,也就是一共有。。。你有多少li我就有多少oLis。

     oLis.onmouseover = function () {
                this.className = "c3"; //为什么此处只能用this,如果把this换成oLis就是错的?
            };
    

    这个语句的意思就是当鼠标移入当前li的时候当前li的样式发生改变。前面说了,this指向事件的调用者。这里鼠标移入的调用者是oLis,也就是for语句当前这个循环里面的li。for循环里面有很多oLis,这里调用的是当前循环的oLis。
    如果把this换成oLis那么就不一定指的是当前循环的oLis。它可能指的是for语句执行完毕后oLis,当然会报错了。用this指向当前调用对象li元素,用oLis就不一定是当前的li了。
    例如

    var count = 10;
    for (var i=0; i<count; i++) {
        console.log(i);
    }
    alert(i);    // 这里弹出10
    
    

    最后弹出的结果并不是哪一个循环里面的i,而是最后的10. 不知这样讲解能不能清楚。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(7条)

报告相同问题?

悬赏问题

  • ¥15 arduino控制ps2手柄一直报错
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥85 maple软件,solve求反函数,出现rootof怎么办?
  • ¥15 求chat4.0解答一道线性规划题,用lingo编程运行,第一问要求写出数学模型和lingo语言编程模型,第二问第三问解答就行,我的ddl要到了谁来求了
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题
  • ¥15 Visual Studio问题
  • ¥20 求一个html代码,有偿
  • ¥100 关于使用MATLAB中copularnd函数的问题