返回课程

哪些处理程序运行?

重要性:5

变量中有一个按钮。它没有处理程序。

在执行以下代码后,点击按钮时哪些处理程序会运行?哪些警报会弹出?

button.addEventListener("click", () => alert("1"));

button.removeEventListener("click", () => alert("1"));

button.onclick = () => alert(2);

答案:12

第一个处理程序会触发,因为它没有被 removeEventListener 删除。要删除处理程序,我们需要传递与分配的函数完全相同的函数。而在代码中,传递了一个新的函数,它看起来一样,但实际上是另一个函数。

要移除一个函数对象,我们需要存储对它的引用,像这样

function handler() {
  alert(1);
}

button.addEventListener("click", handler);
button.removeEventListener("click", handler);

处理程序 button.onclick 独立工作,并且与 addEventListener 相辅相成。