IE 的 Livequery 和 DOMNodeInserted 替代品

Question

这个问题已经在 Whosebug 上被问过几次了，但我还没有找到适合我独特情况的解决方案。

我想替换已弃用的代码 livequery 和 DOMNodeInserted。示例如下。

我正在为我们需要在工作中使用的第 3 方网站开发 javascript。因此，当我的脚本为运行时，页面已加载，我无法访问服务器上的 js 文件。我们只使用IE，当前版本是IE11。

我在这里读到 livequery() 在“您需要响应 DOM 更改并且无法控制导致这些更改的 jQuery 的极少数情况下很有用变化”。这正是我的情况。

我完全是个菜鸟，但我读过 MutationEvents/Observers 可以做到这一点，但它们与 IE 不兼容。无论如何，我所读的内容超出了我的理解范围。

这是我正在尝试做的事情：

当用户单击第 3 方应用程序上的选项卡时，该选项卡上的所有内容都会动态创建。我需要确定选项卡何时完成加载 - 所以我通过检查选项卡上是否存在元素来执行此操作，当它创建时我知道选项卡已加载。

对于此示例，选项卡包含一个名为 's_3_1_12_0_icon' 的图标。

这两个代码片段都会触发所需的结果：

//Method 1: Using DOMNodeInserted
$('body').on('DOMNodeInserted', function () {
    var elementExists = document.getElementById('s_3_1_12_0_icon');
    if (elementExists != null) { 
        alert('The element has just been created')
        $('body').off('DOMNodeInserted');
    }
});

//Method 2: Using Livequery
$('#s_3_1_12_0_icon').livequery(function() {
    alert('The element has just been created')
    $('#s_3_1_12_0_icon').expire();
});

但如前所述，livequery() 和 DOMNodeInserted 已被删除。有这样做的现代方法吗？

Answer 1

...I’ve read MutationEvents/Observers can do this, but they are not compatible with IE...

IE9 和 IE10 都有旧的已弃用突变 events（大部分）； IE11 具有较新的 mutation observers。您绝对可以为此使用突变观察器。

var observer = new MutationObserver(function() {
  if (document.getElementById('s_3_1_12_0_icon') != null) {
    var p = document.createElement('p');
    p.innerHTML = "It fired!";
    document.body.appendChild(p);
    observer.disconnect();
    observer = null;
  }
});
observer.observe(document.body, {
  childList: true,
  subtree: true
});
setTimeout(function() {
  var div = document.createElement('div');
  div.id = "s_3_1_12_0_icon";
  document.getElementById("descendant").appendChild(div);
}, 600);

<div>
  <div>
    <div id="descendant"></div>
  </div>
</div>
<p>In a moment, we'll add the element and see if the observer fires...</p>

（div 只是为了证明它不一定是 body 的直接子代。）

IE 的 Livequery 和 DOMNodeInserted 替代品

Livequery and DOMNodeInserted replacement for IE

javascript

jquery

internet-explorer

deprecated

livequery