如何使用MutationObserver獲取導致DOM突變的函數？

Question

我目前正在嘗試找出哪個函數使用MutationObserver修改了DOM。 不幸的是，以下代碼段不起作用（堆棧跟蹤似乎為空）。

var targetNode = document.body;
var config = { attributes: true, childList: true, subtree: true };
var callback = function(mutationsList, observer) {
    for(var mutation of mutationsList) {
      // The trace unfortunatelly doesn't contain the function 
      // "addSomeElement", which I am trying to receive at this point.
      console.trace(); 
    }
};

var observer = new MutationObserver(callback);
observer.observe(targetNode, config);

接下來是一些DOM突變：

function addSomeElement() {
  targetNode.appendChild(document.createElement('span'));
}
addSomeElement();

有什么辦法可以輸出實際發生突變的函數（在本例中為appendChild ）？

Answer 1

使用DOM斷點（應在Chrome和Firefox中工作）

開發者工具
->檢查員
->右鍵單擊要監視的元素
->中斷：子樹修改

更改所選節點的子元素后，瀏覽器將在負責的JavaScript上中斷。

Answer 2

你不能

MutationObserver返回MutationRecord ，該記錄僅描述更改本身。

它沒有提供有關這些更改是如何實現的信息。