<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>for循环绑定事件i丢失问题</title>
</head>
<body>
<ul>
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
<li>555</li>
</ul>
<script type="text/javascript">
var lis = document.getElementsByTagName('li');
//for循环绑定事件 i丢失问题 解决办法 在for循环里 套一层匿名函数 让局部变量 不受外部影响
for (var i = 0; i < lis.length; i++) {
(function (i) { //这个括号里 是形参
lis[i].onclick = function(){
console.log(i); //依次点击输出 0 1 2 3 4
}
})(i) //这个括号里 是实参
}
</script>
</body>
</html>
在这里插入图片描述