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

Question

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 也就是只有最后一个变颜色

Answer 1

其实写成这样就好了吧：var li = document.querySelectorAll('li');for (var i = 0 ; i < 11 ; i ++){&nbsp; &nbsp; li[i].onmouseover = function () {&nbsp; &nbsp; &nbsp; &nbsp; this.style.backgroundColor = 'white';&nbsp; &nbsp; };}（虽然知道是闭包题，但是能解决问题不就得了么。。）