javascript中循环加载监听事件的闭包问题

Javascript中的闭包跟自身带来的强大的功能，但是这仅仅是限于知道怎么用它的人，如果不懂其原理，那么自己写的代码就会经常遇到闭包所影响的变量作用域问题，下面说说我个人遇到的一个问题，也是一般人都会遇到的问题吧，就是给DOM中的元素循环加载监听事件的时候，i变量值的问题。

看代码：

var aDivs = document.getElementsByTagName('div');//获取多个div集合
for(var i=0; i<aDivs.length; i++){
aDivs[i].onclick=function(){
alert(i);
}
}

可以发现上面弹出的结果都是aDivs的长度，而不是预期的一些从小到大的数，这里就是因为闭包的问题影响的i的取值。解决办法有下面两个：

第一个方式很简单，如下：

var aDivs = document.getElementsByTagName('div');//获取多个div集合
for(var i=0; i<aDivs.length; i++){
aDivs[i].index = i;
aDivs[i].onclick=function(){
alert(this.index);
}
}

第二种方式如下：

var aDivs = document.getElementsByTagName('div');//获取多个div集合
for(var i=0; i<aDivs.length; i++){
add(i);
}
function add(i){
aDivs[i].onclick=function(){
alert(i);
}
}

第一种方式使用给对象添加变量的方式解决了问题，就是每次把i保存下来作为对象的一个属性；第二种方式就是利用闭包解决了闭包本身带来的问题。