for循环点击事件 - 遇到的问题

原因分析：
i会不停的覆盖，只会记录循环最后一次的i的赋值，导致永远无法实现i为奇数时的样式改变。

解决方案：
方案一：将for循环改为forEach循环，但forEach循环针对数组使用，若是节点列表或者对象即不适用。
方案二：将点击事件放到函数用，在for 循环中仅调用函数实现多次的调用。 函数每次调用会调用一个独立的i。
方案三：将for循环中的var换成let。

var checkboxs = document.querySelectorAll("input[name=check]");
for (var i = 0;i < checkboxs.length;i++){
    function f (i);
}
function f (i){
    checkboxs[i].onclick = function(){
        var line = this.parentElement.parentElement;
        // this 在点击事件中代表的checkboxs[i]
        if(this.checked == true){
            line.style.backgroundColor = 'darkblue';
        }else{
            if(i % 2 == 0){
                line.style.backgroundColor = 'lightcyan';
            }else{
                line.style.backgroundColor = 'lightblue';
            }
        }
    }
}