javascript - js写循环只有最后一个有效

问题描述

问 题

var li = document.querySelectorAll('li');
for (var i = 0 ; i < 11 ; i ++){
        li[i].addEventListener('mouseover', function () {
            li[i].style.backgroundColor = 'white';
            console.log(i);
        });
    }

希望的效果是鼠标经过标签的时候改变颜色
通过addevenlistener添加mouseover实现
但是现在的效果是不管鼠标经过哪个li
consolelog输出的都是11 也就是只有最后一个变颜色

解决方案

其实写成这样就好了吧：

var li = document.querySelectorAll('li');
for (var i = 0 ; i < 11 ; i ++){
    li[i].onmouseover = function () {
        this.style.backgroundColor = 'white';
    };
}

（虽然知道是闭包题，但是能解决问题不就得了么。。）

这篇关于javascript - js写循环只有最后一个有效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！