Javascript - 跟踪任何 xmlhttprequest

Question

我可以在不添加 addEventListener 的情况下检查页面上的任何 XmlHttpRequest 可执行文件吗？我尝试添加

document.addEventListener("loadend"...)

但什么也没发生。 看起来请求没有全局事件？

// 已编辑 //

我需要检测由 ajax 加载的新元素。 很好的解决方案-here

使用MutationObserver

Answer 1

我认为你应该重新考虑你的设计。你为什么要这样做。有更好的选择吗？

但是，如果您真的想这样做，您可以通过用您自己的覆盖标准 XmlHttpRequest 对象来“破解”它。您必须在启动任何 XmlHttpRequest 之前执行此操作，以使其适用于所有对象。

//store the original XMLHttpRequest in a variabele so you can use it yourself
var originalXMLHttpRequest = XMLHttpRequest;

//Overwrite the original object with your own in which you create an instance of the original object, add an event listner to it and return that.
XMLHttpRequest = function() {
  var req = new originalXMLHttpRequest();
  req.addEventListener("loadend", function() {
    console.log("loadend event fired");
  });
  return req;
};

//Test if it works
httpReq = new XMLHttpRequest();
httpReq.open("GET", "https://stackoverflow.com/");
httpReq.send();

Answer 2

让您的XMLHttpRequests 在完成后触发一个自定义事件，然后监听这些事件。

var r = new XMLHttpRequest();
r.onload = function() {
    e = new CustomEvent('myLoadend', {detail: {foo: 'bar'}});
    document.dispatchEvent(e);
}

并聆听这些事件：

document.addEventListener("myLoadend"...)