循环注册事件，实现每个 li 元素的点击赋值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
第一种：利用立即执行函数将事件整个包裹，形成作用域块
var lis = document.querySelectorAll('li');
for (var i = 0; i < lis.length; i++) {
(function(i) {
//形参
lis[i].onclick = function() {
this.innerHTML = i;
}
})(i); //实参
}
第二种：利用函数表达式，用立即执行函数返回不同的注册函数
var lis = document.querySelectorAll('li');
for (var i = 0; i < lis.length; i++) {
lis[i].onclick = (function(i) {
return function() {
this.innerHTML = i;
}
})(i);
}
第三种：利用 let 关键字，形成作用域块
var lis = document.querySelectorAll('li');
for (let i = 0; i < lis.length; i++) {
lis[i].onclick = function() {
this.innerHTML = i;
}
}