闭包初认识
2016-02-29 本文已影响4人
连庄小公举
1.html如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>try-函数</title>
<script type="text/javascript">
</script>
</head>
<body>
<div id="div1">aaa</div>
<div id="div2">bbb</div>
<div id="div3">ccc</div>
</body>
</html>
2.在，script标签中插入如下js
window.onload=function () {
for (var i=1;i<4;i++){
var aa= document.getElementById('div'+i);
aa.addEventListener('click',function(){
alert(i);
})
}
}
执行结果均为4；
3.改变代码如下
window.onload=function () {
for (var i=1;i<4;i++){
(function (i) {
var aa= document.getElementById('div'+i);
aa.addEventListener('click',function(){
alert(i);
})
})(i)
}
}
得到了预期结果，点击aaa时弹出1，bbb时弹出2，ccc弹出3。
在js中函数内部可以读取全局变量，但是函数外部无法读取函数内的局部变量。
第一种情况下i为全局变量，i始终取值为for循环的最后一个值。
今天的学习中还出现了一个很无语的问题，div中书写id时多了一个空格，document.getElementById("div"+i)无论如何都取不到值。
