Javascript 为什么事件侦听器只在for循环中创建的最后一个元素上注册？

我使用JavaScript创建复选框，将

onchange

侦听器添加到复选框中，并使用循环将其添加到div中。但是，只有最后一个复选框注册了事件侦听器

为什么会这样

var div=document.getElementById（“mydiv”）；
对于（变量i=0；i<5；i++）{
div.innerHTML+=（“
”+i）；
var输入=document.createElement（“输入”）；
input.type=“checkbox”；
input.onchange=函数（）{
警惕（“foo”）；
};
div.appendChild（输入）；
}

---

使用

元素添加到
div
。innerHTML

属性删除现有的事件处理程序，因为它确实在这样做

div.innerHTML = (div.innerHTML + '<br>' + i);