<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button>
<button>5</button>
<script type="text/javascript">
var btns=document.querySelectorAll("button");
//i的值等于btns.length
for(var i=0;i<btns.length;i++){
btns[i].onclick=function () {
console.log(i);//5
}
}
// 方法一:自定义属性
for(var i=0;i<btns.length;i++){
btns[i].index=i;
console.log('i',btns[i].index)
btns[i].onclick=function(){
console.log(this.index);
}
}
// 方法二:闭包,自执行函数传参i
for(var i=0;i<btns.length;i++){
(function(i){
btns[i].onclick=function(){
console.log(i)
}
})(i)
}
// 方法三:es6,let声明变量
for(let i =0;i<btns.length;i++){
let i=10;
console.log(i)
}
console.log(i)
</script>
</body>
</html>