js点击按钮，弹出按钮的下标

DOM结构

<input type="button" value="1">
<input type="button" value="2">
<input type="button" value="3">

var btnS=document.getElementsByTagName('input');
for(var i=0;i<btnS.length;i++){
       btnS[i].onclick=function () {
       alert(i)
   }
}

如果这样写，每个按钮都会弹出3，因为i是全局变量

解决办法一：
匿名函数自调
for(var i=0;i<btnS.length;i++){
       (function (i) {
           btnS[i].onclick=function () {
           alert(i+1)
      }
   })(i)
}
把i的作用域限定在匿名函数内，也就是变成局部变量，局部变量在执行完毕后，会自动释放

解决办法二：
使用let
for(let i=0;i<btnS.length;i++){
     btnS[i].onclick=function () {
     alert(i)
  }
}
let会把变量的作用域限定在当前代码块内