关于在for循环中绑定事件打印变量i是最后一次。

参考：

1.https://www.cnblogs.com/liao8735/p/3944913.html

2.https://www.cnblogs.com/pssp/p/5215417.html

在编写JS的时候我们经常会遇到要对一系列元素进行事件绑定，循环对元素的事件进行赋值，在这个过程中我们会遇到一个问题，那就每个元素事件运行的时候变量怎么都是相同的值。

这里涉及到变量的作用域的问题，可以用闭包来解决这个问题。

这里举个简单的列子来说明：

<ul id="ulDemo">
　　<li>数据</li>
　　<li>数据</li>
　　<li>数据</li>
　　<li>数据</li>
　　<li>数据</li>
</ul>

我们来给这些li添加一个onclick事件，弹出li是第几条数据

1 2 3 4 5 6 7

var list = document.getElementById("ulDemo").getElementsByTagName("li");  for (var i = 0; i < list.length; i++) {      var li = list[i];      li.onclick= function () {          alert("第" + (i + 1) + "条" + this.innerHTML);      }  }

结果弹出的都是第6条数据，这里的onclick函数中的变量i指向的内存地址，经过循环之后i变成了5，所有的li的点击事件都在同一个作用域中，我们可以通过闭包把i的作用域独立出来

1 2 3 4 5 6 7

var list = document.getElementById("ulDemo").getElementsByTagName("li");       for (var i = 0; i < list.length; i++) {           var li = list[i];           li.onclick= (function (index) {               return function () { alert("第" + (index + 1) + "条" + this.innerHTML) };           })(i);       }

其他写法

1 2 3 4 5 6 7 8 9

for (var i = 0; i < list.length; i++) {            var li = list[i];              var addClick = function (el, index) {                el.onclick= function () { alert("第" + (index + 1) + "条" + this.innerHTML) };            };              addClick(li, i);        }

　　

1 2 3 4 5 6 7

for (var i = 0; i < list.length; i++) {            var li = list[i];              (function (el,index) {                el.onclick= function () { alert("第" + (index + 1) + "条" + this.innerHTML) };            })(li,i);        }