Question

我将一些功能附加到DOM元素，并且希望能够在从DOM中删除元素时清除所有引用，以便可以对其进行垃圾回收，

我检测元素移除的初始版本是：

concatenate

然后我读到mutation events被弃用，而不是MutationObserver。所以我试着移植我的代码。这就是我想出的：

var onremove = function(element, callback) {
    var destroy = function() {
        callback();
        element.removeEventListener('DOMNodeRemovedFromDocument', destroy);
     };
     element.addEventListener('DOMNodeRemovedFromDocument', destroy);
};

这对我来说过于复杂（而且效率不高）。我错过了什么，或者这真的是这个应该有用的方式吗？

Answer 1

实际上......是的，有一个更优雅的解决方案：）。

您添加的内容看起来不错，似乎已经过优化。但是，有一种更简单的方法可以知道节点是否附加到DOM。

function onRemove(element, onDetachCallback) {
    const observer = new MutationObserver(function () {
        function isDetached(el) {
            if (el.parentNode === document) {
                return false;
            } else if (el.parentNode === null) {
                return true;
            } else {
                return isDetached(el.parentNode);
            }
        }

        if (isDetached(element)) {
            observer.disconnect();
            onDetachCallback();
        }
    })

    observer.observe(document, {
         childList: true,
         subtree: true
    });
}

DOMNodeRemovedFromDocument的简单MutationObserver版本

1 个答案: