Question

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

在这个脚本中，有一个我需要监听的函数，它将一个类添加到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
}

Answer 1

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

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

_showElement(); // hijacked


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

不幸的是我不认为你可以保存该函数的原始行为，所以你需要复制粘贴它：

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

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

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

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

Answer 2

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

在Javascript中监听功能

2 个答案: