js关闭导致的事件注册问题介绍

背景：在业余时间看了几篇关于js范围链和闭包的文章后，碰巧看到了之前遇到的一个问题，那就是在for循环中为dom节点注册事件驱动。有关详细信息，请参见以下代码：

！doctype html headtitle js闭包/title meta charset=' utf-8 '/head bottom id=' anchor 1 ' 1/button button id=' anchor 2 ' 2/button button id=' anchor 3 ' 3/button script type=' text/JavaScript ' src=' http : jquery-1 . 12 . 1 . js '/script script type=' text/JavaScript ' function page load(){ for(var I=1；I=3；I){ var anchor=document . getelementbyid(' anchor ' I)；anchor . onclick=function(){ console . log(' anchor ' I)；} } } window.onload=pageLoad/script/body/html按照正常思路，结果应该是点击三个按钮分别提示“anchor1”、“anchor2”和“anchor 3”；一开始我也是这么想的，但结果是无论点击哪个按钮，都会提示“anchor4”。

这是为什么？别担心，我们慢慢分析的时候，里面包含了js范围链和闭包的知识，这里就不详细介绍了。

首先，让我们看看这个主播。点击。这是什么？这是一个dom0级别的事件处理程序。胡说八道。我也知道博主是蛇精病。* * * * * * * * * * * * *别争论了。我想谈谈这个主播

它是一个事件处理程序的声明，就像var name=' Xiaoming '一样。声明了，但是还没有执行。这是关键。让我们修改上面的js代码，看看：

函数PageLoad(){ for(var I=1；I=3；I){ var anchor=document . getelementbyid(' anchor ' I)；anchor . onclick=function(){ console . log(' anchor ' I)；} if(i==2){调试器；//我们在这里调试，然后手动触发#anchor1和#anchor2}}}窗口的点击事件，onload=page load；

看，我们通过调试器在i==2处停止循环，然后到控制台手动触发#anchor1和#anchor2的点击事件，控制台打印“anchor2”。

整个逻辑大致如下：anchor.onclick一直保持I的引用，I总是在循环中变化，从i=1到I=4；虽然anchor.onclick在流通过程中被保留了下来(注意“曾经”这个词)，

1、2、3，但我最终变成了4，所以无论点击哪个按钮，都会输出“anchor4”。

结论：js中范围链和闭包的知识非常重要。这里虽然没有提到，但其实是怕不理解，反而误导大家。

以上关于js关闭导致事件注册的介绍，都是边肖分享的内容，希望能给大家一个参考和支持。