javascript - 如何防止向 DOM 节点添加元素？

Question

我有一个非常恶心的问题。“恶心”是因为我无法完全控制整个网页，因此必须破解我的成功之路。

情况

我有自己的脚本，它被加载到网页中，以及一个div显示页面导航的容器。我想向该容器添加一个链接，并且该容器应该只包含该单个链接。

问题

有一个第三方脚本，它也添加到该容器的链接。它在 AJAX 回调函数中执行此操作

我试过的

1.文档完全加载后删除除我之外的所有链接

这是不可能的，因为第三方脚本通过 AJAX 回调加载内容，因此当页面完全加载时，不需要的链接尚未呈现。

2.重命名div容器

添加到容器的链接后，我完全剥离了容器，删除了类名、ID 等。但第三方脚本仍然找到了该容器。

3. 将事件附加DOMNodeInserted到容器

在我称之为浏览器的任何东西上都很好用。但在 IE 中失败。IE 是该页面用户使用的主要浏览器。

我还能尝试什么？

Answer 1

如果第三方脚本使用 jQuery，那么您可以尝试ajaxComplete()。

Answer 2

可以监听 DOMSubtreeModified 事件，恢复原来的 div 状态。

var originalChildren = $('#content').children();

var setOriginal = function(e) {
    $('#content').off('DOMSubtreeModified');
    $('#content').empty().append(originalChildren);
    $('#content').on('DOMSubtreeModified', setOriginal);
};

$('#content').on('DOMSubtreeModified', setOriginal);

测试一下。

Answer 3

您可以覆盖/包装其他脚本用于添加元素的 DOM 方法，例如 appendChild()。像这样的东西（伪代码）

var originalAppend = document.appendChild;
document.appendChild = function () {
    if condition {
        originalAppend.apply(document, arguments);
    }
}