闭包

喜欢而已 提交于 2020-02-27 15:11:41

html

<button>测试1</button>
<button>测试2</button>
<button>测试3</button>

js

//错误
var btns = document.getElementsByTagName('button')
for (var i = 0; i < btns.length; i++) {
  btns[i].onclick = function() {//事件回调函数:必须等到主线程的任务执行完毕,才能执行事件回调函数。
    console.log(this)
  }
}

//正确1
for (var i = 0; i < btns.length; i++) {
  btns[i].index = i;    //给每个按钮绑定一个自定义属性 index ,存住每个i
  btns[i].onclick = function() {
    console.log(this.index)
  }
}

//正确2:闭包解决
for (var i = 0; i < btns.length; i++) {
  //立即执行函数
  ;(function(i) { //此处i是形参
    btns[i].onclick = function() {
      console.log(i)
    }
  })(i) //此处i是实参
}
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!