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

我正在寻找替换不赞成使用的代码livequeryDOMNodeInserted。示例如下所示。

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

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

我对这个东西完全陌生,但是我已经读过MutationEvents / Observers可以做到这一点,但它们与IE不兼容。无论如何,我现在所读的内容超出了我的理解范围。

这是我想做的事情:

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

对于此示例,选项卡包含名为“ 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被描述。有现代化的方法吗?

最佳答案

...我读过MutationEvents / Observers可以做到这一点,但它们与IE不兼容...


IE9和IE10都有旧的不赞成使用的突变事件(大多数情况下); 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的直接子代。)

07-24 09:20