JS循环为li元素添加点击事件:利用闭包解决变量捕获问题

作者:木棉时间:2026-10-30 18:24:30浏览:307

本文介绍在JavaScript中如何为循环生成的li元素正确绑定点击事件。通过展示一段使用闭包保存循环变量i的代码示例,解释了如何利用立即执行函数(IIFE)避免变量引用错误,确保每个元素点击时能获取正确的索引值。

JS循环绑定li点击事件与闭包应用

直接来看具体的代码实现。

代码实现


 var aLi = document.querySelectorAll('.article-tab li');
 for (var i = 0; i <= aLi.length; i++) {   
 (function(){   
  var p = i   
  aLi[i].onclick = function() {   
   alert(p);   
  } 
 })(); 
}

上述内容介绍了在JavaScript中通过循环为li元素添加点击事件的方法,重点展示了闭包的应用场景。希望这段内容能对大家有所帮助,如有任何疑问,欢迎留言,小编会及时回复。

作者最新文章