<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>闭包</title>
<style type="text/css">
div {
100px;
height: 100px;
background: lightgreen;
float: left;
margin: 20px;
font: 30px/100px "microsoft yahei";
text-align: center;
}
</style>
</head>
<body>
<div>a</div>
<div>b</div>
<div>c</div>
<div>d</div>
<div>e</div>
<div>f</div>
<div>g</div>
<div>h</div>
<div>i</div>
<div>j</div>
<script type="text/javascript">
var divs=document.getElementsByTagName("div");
for (var i=0;i<divs.length;i++) {
divs[i].onclick=function(){
alert(i);
}
}
</script>
</body>
</html>
运行结果：
点击每一个div都是10，根本原因是var没有块级作用域只有函数作用域，而点击事件的函数内部使用外部的变量i一直在变化，当我们指定click事件时并没有保存i的副本
修改代码，使用闭包：
//方法一 for (var i=0;i<divs.length;i++) { (function(i){ divs[i].onclick=function(){ alert(i); } })(i) } //方法二 for (var i=0;i<$("div").length;i++) { $("div")[i].onclick=(function(n){ return function(){ alert(n); } })(i) }
结果：
总结：
（1）外界无法访问闭包内部的数据，如果在闭包内声明变量，外界是无法访问的，除非闭包主动向外界提供访问接口；
（2）一般的函数，调用完毕之后，系统自动注销函数，而对于闭包来说，在外部函数被调用之后，闭包结构依然保存在
（3）使用闭包会占有内存资源，过多的使用闭包会导致内存溢出等.