侦听 Javascript 中的函数

Listen for function in Javascript

本文关键字：函数 Javascript 侦听      更新时间：2023-09-26

>我正在使用我不想修改的第三方脚本。

在这个脚本中，我需要侦听一个函数，它将一个类添加到 dom 节点。

  function _showElement(targetElement) {
      targetElement.element.className += 'this-class';
  }

我想做的是监听这个元素被调用，以及每当它使用纯 javascript 向其父级添加一个类时。

function addThis() {
    var doc = document;
    liveEl = doc.getElementsByName("this-class");
    // Code to add class to parent
}

最简单的"蛮力"解决方案是劫持（重新定义）函数：

function _showElement(targetElement) {
  console.log('original');
}
_showElement(); // hijacked

function _showElement(targetElement) {
  console.log('hijacked');
}

不幸的是，我认为您无法保存函数的原始行为，因此您需要复制粘贴它：

function _showElement(targetElement) {
  targetElement.element.className += 'this-class';
  addThis()
}

另一个解决方案，更具体地针对您的问题（当元素的类名更改时执行某些操作），您可以在 DOM 上侦听突变事件：

https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

基本上，你创建一个突变观察者并观察元素上的属性变化。如果您需要跟踪所有节点，这可能不是一个很好的解决方案，但在某些情况下，它可能会派上用场。

你不能直接这样做。您无法侦听像 dom 属性更改这样的事件。但是，有一种方法可以识别触发_showElement的事件，并将另一个处理程序附加到应调用addThis函数的事件。

相关文章：