for循环绑定事件，寻找索引的问题

for循环绑定事件，寻找索引的问题

在一个li 的列表当我们想给li绑定一个点击事件，你是否有这样的想法

function myfun(){
var li = document.getElementsByClassName("li");
for (var i = 0;  i< li.length ;i++) {
        li[i].onclick = function( ){
           console.log(i);
            			}   
			}
	}

但是你会发现，控制台最后答应出来的却是li 最终的长度，为什么呢？
其实当我们对li进行点击的时候，for循环已经结束，绑定到li上的事件是后执行的，这时候i值已经变成li的长度了。

为了解决这种情况我们大概有两种解决方法。

第一种方法，给每个li绑定一个n属性，n是随便起的，你可以写index都行，将每一个的索引存入li的n属性中；

for (var i = 0;  i< li.length ;i++) {
		li[i].n = i;
       li[i].onclick = function( ) {
         	console.log(this.n);
        	 }   
   	}
   	

第二种方法，用立即执行函数，把i安参数传进去，用该函数的参数绑定循环变量当前的值

 for (var i = 0; i < li.length; i++){
        li[i].onclick = function(n) {
    　　	return function() {
             console.log(n)
           	 }
    　	}(i)
    }