Question

我的初步研究已经空洞，我不确定这是否可行。我正在寻找使用直接javascript的解决方案。由于设备的限制，我无法使用jQuery。基本上，我想附加一个事件，以便在删除元素时提供执行函数。

[编辑]
我们通过函数调用进行DOM操作。现在，我们目前不会遍历整个树以删除每个元素。我们只删除父节点。我希望通过附加到一个事件来提供一个快捷方式，但我想我将不得不走很长的路，并在函数中提供额外的逻辑。我需要这个的原因是因为我们需要能够在删除特定元素时对DOM运行清理操作。

现在优先级只是Opera支持，但我想完成跨浏览器解决方案。

Answer 1

您定义了一些名为DOM突变事件的东西：

http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-mutationevents

目前这仅适用于Firefox，而不适用于Internet Explorer。

Answer 2

如果您对跨浏览器支持感兴趣，“关于元素删除”不是an HTML 4 event，所以我认为您可能在这里运气不好。但是，如果你采用了另一种策略，我认为你会有一些运气：因为你正在进行删除，限制了删除元素的方式。然后只需在那里调用回调而不是在事件处理程序中。

Answer 3

直接的答案是否定的。当前的DOM实现不会提供任何可以挂钩以监视DOM更改的事件。

也许您可以在问题中添加为什么需要这个，可能有其他选择。例如，如果通过代码删除DOM元素，那么可以修改该代码以参与观察者模式吗？

Answer 4

如果你不是这样做的话，我想知道如何移除节点。

移除后多久需要知道？你可以检查它是否每秒消失一次？

Answer 5

我不是DOM专家，但你可以覆盖removeChild方法吗？

如果它有效，它不是一个完美的解决方案，因为DOM元素的其他方式可以消失（例如，在其中一个优势上设置innerHTML）。

您还可以在父母处存储子计数。然后将该计数与实际子计数进行比较。当然，这需要投票，而不是事件。

Answer 6

我在Javascript方面不强，但很快就嘲笑了下面的代码，它在Firefox中运行。您可能很幸运能够在其他浏览器中使用它。

<ul id="main">
    <li id="e1">Item 1</li>
    <li id="e2">Item 2</li>
</ul>

<script type="text/javascript">
var main = document.getElementById('main');
main.origRemoveChild = main.removeChild;
main.removeChild = function(child) {
    alert('Removing element ' + child.tagName + ' with id=' + child.id);
    this.origRemoveChild(child);
}
var e1 = document.getElementById('e1');
main.removeChild(e1);
</script>

由于您更新了问题，我在此处提供了另一种解决方案：

removeFromDOM(e) {
    for (var i = 0; i < e.childNodes.length; ++i) {
        var child = e.childNodes[i];
        removeFromDOM(child);
        if (typeof child.onremove == 'function') {
            child.onremove();
        }
        e.removeChild(child);
    }
}

这将递归删除每个嵌套节点。在删除之前，将尝试执行onremove方法。希望有所帮助。

有没有一种方法可以在删除元素时通知DOM？

6 个答案: