如何获取闭包中循环的i值

假设有这样的一个问题：ul中含有多个li标签，我们想对每个li绑定点击事件，并且打印出该li为第几个li元素

一般写法是写一个for循环

var lis = document.getElementsByTagName("li");
 for (var i = 0; i < lis.length; i++) {
    lis[i].onclick = function(){

        console.log(arg);
    };      
 }

但是，这样写之后我们发现，点击任何一个li，打印的值都为5，这是因为闭包中共用i值，而i的值由于执行for循环，都变为了5

为了正常显示i值，我们可以使用如下方法

//方法1：加一层闭包 将i值以参数形式传递给内层函数
 for (var i = 0; i < lis.length; i++) {
    (function(arg){
        lis[i].onclick = function(){
            console.log(arg);
        };
    })(i)   
 }

/*方法二：加一层闭包，i以局部变量形式传递给内层函数*/
for (var i = 0; i < lis.length; i++) {
    (function(){
        var temp = i;
        lis[i].onclick = function(){
            alert(temp);
        }
    })()    
 }

/*方法三：将i值作为对象的属性值*/
for (var i = 0; i < lis.length; i++) {
    lis[i].i = i;
    lis[i].onclick = function(){
        console.log(this.i);
    }
 }

/*方法4：用function实现 实际上，没产生一个函数实例就会产生一个闭包*/
 for (var i = 0; i < lis.length; i++) {
    lis[i].onclick = new Function("console.log("+i+");")
 }

参考文献：在循环中正确找到对应DOM元素的索引