例题:
<body>
<div id="btnBox">
<input type="button" value="button_1" />
<input type="button" value="button_2" />
<input type="button" value="button_3" />
<input type="button" value="button_4" />
<input type="button" value="button_5" />
</div>
</html>
<script>
var btnBox=document.getElementById('btnBox'),
inputs=btnBox.getElementsByTagName('input');
</script>
let的方法:
for(let i=0;i<l;i++){
inputs[i].onclick=function(){
alert(i);
}
}
块级作用域起作用
自定义属性的方式
for(var i = 0; i < inputs.length; i++){
inputs[i].qqq = i; // 当i=0时,给第一个input增加一个自定义属性,对应的值 是 当前索引;
inputs[i].onclick=function(){
console.log(this);
alert(this.qqq);
使用自定义属性,思想在于 把 索引 存储到 对应元素的自身上
当i=0时,给第一个input增加一个自定义属性,对应的值 是 当前索引
}
闭包的方式
第一种方式
for(var i = 0; i < l; i++){
(function(n){
inputs[n].onclick = function(){
alert(n);
}
})(i)
}
第二种方式
for(var i=0; i< l; i++){
inputs[i].onclick = (function(n){
return function(){
console.log(n)
}
})(i)
第三种方式
function fn(n){
return function () {
console.log(n)
}
}
for(var i=0; i < l; i++){
inputs[i].onclick = fn(i)
}
闭包:闭包是一个私有变量的保护机制; 闭包是个变量的保护机制,保护私有变量不受外界的污染