覆盖函数表达式事件侦听器不起作用答案

【问题标题】：Override function expression event listener not working覆盖函数表达式事件侦听器不起作用
【发布时间】：2018-01-23 18:44:37
【问题描述】：

我正在尝试覆盖附加到事件侦听器的函数，但是当事件被触发时，旧的仍然被调用。

var element;
var newHandler = () => {
  if((element = this.getElementsByClassName('someClass')[0]) != null){
    this.removeEventListener('DOMNodeInserted', handler )
    element.insertAdjacentHTML('beforeend', "<a>Hello</a>");
  }
}

var handler = () => {
  handler = newHandler;
  var scriptTag = document.createElement('script');
  scriptTag.src = "someScript.js";
  document.head.appendChild(scriptTag);
}

document.addEventListener('DOMNodeInserted', handler);

非常感谢任何形式的帮助。非常感谢！

【问题讨论】：

是什么让您认为handler = newHandler 会更改传递给addEventListener 的事件侦听器？
感谢您的评论。我认为“handler = newHandler”应该可以完成这项工作。
也许我不是很清楚，我知道您认为这会起作用。我在问为什么你认为这会奏效。无论如何，它绝对行不通（正如您已经看到的那样），您需要了解有关 JS 事件 API 的更多信息。
我认为将调用函数的标识符 ( handler ) 的指针覆盖到 newHandler 足以做我想做的事情，所以下次触发事件时，将调用 handler 并执行 newHandler。这个时候我该怎么办？
我正在阅读我的第一条评论，我意识到它的胡言乱语是如此的糟糕......

标签： javascript dom addeventlistener event-listener function-expression

【解决方案1】：

找到解决办法

var element;
var newHandler = () => {
  if((element = this.getElementsByClassName('someClass')[0]) != null){
    document.removeEventListener('DOMNodeInserted', intermediary )
    element.insertAdjacentHTML('beforeend', "<a>Hello</a>");
  }
}

var handler = () => {
  handler = newHandler;
  var scriptTag = document.createElement('script');
  scriptTag.src = "someScript.js";
  document.head.appendChild(scriptTag);
}

var intermediary = () => handler();

document.addEventListener('DOMNodeInserted', intermediary );

我认为问题是由某种一级缓存引起的。

【讨论】：