javascript - 对于使用 XMLHttpRequest 更改其内容的页面来说，合适的事件监听器是什么？

Question

通过在 C# 中使用 GeckoWebBrowser 是否可以知道页面何时使用 XMLHttpRequest 完成更新其内容？我认为 DocumentCompleted 事件会完成此操作，但由于页面没有重新加载，因此不会启动...

Answer 1

您可以使用mutation observer观察 document.body 的子树，并假设页面在您收到最后一次通知后 20 毫秒(例如)已完成修改。

在 JavaScript 中，它看起来像这样:

(function() {
  var observer;

  // The click handler that appends content after a random delay
  document.querySelector('input').addEventListener("click", function() {
    if (!observer) {
       hookupObserver();
    }
    setTimeout(function() {
      var p = document.createElement('p');
      p.innerHTML = "New content added at " + Date.now();
      document.querySelector('div').appendChild(p);
    }, 500 + Math.round(Math.random() * 500));
  }, false);
  
  // Watching for subtree mods to `document.body`:
  function hookupObserver() {
    var timer = 0;
    observer = new MutationObserver(function() {
      clearTimeout(timer);
      timer = setTimeout(done, 40);
    });
    observer.observe(document.body, {childList: true, subtree: true});
  }
  
  function done() {
    timer = 0;
    alert("Modification complete");
  }
})();

<input type="button" value="Click to simulate async modification">
<div>This is the page</div>