javascript - 如何在 Javascript 中监听元素方法调用

Question

我想听方法调用。

例如，当一个元素被任何内容附加到文档时，我希望传递该元素以对其进行操作，例如：

//某处

aParent.appendChild(aChild);

//当前者时，我定义为侦听器的函数使用aChildas 参数调用

有人知道该怎么做吗？

score 1 · Accepted Answer

不知道核心功能是否可行，但您始终可以为要监控的操作创建自己的功能：


function AppendChild(oParent, oChild) {

   // your stuff on oParent

   // append oChild
   oParent.appendChild(oChild)
}

或者，也许，修改实际的 appendChild()，但这会很棘手......

score 0 · Accepted Answer

您所描述的是面向方面的编程。在 AOP 用语中，您的“连接点”将是 element.appendChild()，而您的“建议”是您希望执行（之前和/或之后）每个匹配的连接点执行的函数。

一段时间以来，我一直对 JavaScript AOP 的可能性非常感兴趣，我刚刚发现了这个Aspect Oriented Programming 和 javascript，它看起来很有希望，不需要采用一个大的旧 API。——我真的很高兴你提出这个问题。我对此有用途，例如临时日志记录、计时代码段等。

score 0 · Accepted Answer

多个浏览器以不同的方式处理 DOM，不幸的是 IE 处理事物的方式不如 Mozilla 的方式强大。最简单的方法是使用像 Filini 提到的自定义函数。

但是，您也可以将不同浏览器的 DOM 对象包装在外观中，并将其用于所有元素访问。这需要更多的工作，但您将能够以相同的方式处理所有浏览器，并能够轻松添加/删除侦听器。我不确定它是否比自定义函数更有用，但值得一看。

score 0 · Accepted Answer

我知道 Dojo Toolkit 提供了这个功能。您可以在此处进行一些解释- 跳转到“将功能相互连接”部分。有兴趣的可以看看dojo.connect的源码看看是怎么回事。

score 0 · Accepted Answer

在 Firefox 中，您可以重写Node .prototype.appendChild 以调用您自己的函数（先保存原始的 appendChild，然后在其中调用它）来执行其他操作。

Node.prototype._appendChild = Node.prototype.appendChild;
Node.prototype.appendChild = function myFunct(el){....; this._appendChild(el);}

Internet Explorer 没有实现这些接口（但可能有一种解决方法，可能使用 .htc..）。IE8 将有 Element 而不是 Node。

5 回答 5