如何通过页面获得有关aj​​ax驱动的更改的用户脚本？

Question

如果网页上的项目随着时间的推移而被AJAX调用更改，那么无论何时发生这些更改，用户脚本如何得到通知？

想象一下Facebook的新闻源。加载页面时，它有12个项目。这些项目包含在<li>中包含的<ul>标记中。当您向下滚动页面时，新的<li>数据块会加载到<ul>。

我想知道如何通知用户提示此类更改。

一个想法是不断查询<ul>，计算其项目，并观察该数字是否变大。可能，但是为了在发生变化时正确地抓住它，它可能必须经常运行以至于太昂贵。

另一个想法是找出什么滚动位置触发加载，并观察这种变化。更便宜，但非常具体。

我想知道是否有第三种选择。无论何时发生变化，都会通知我这一变化。我不仅对饲料感兴趣，而且更普遍地在这个概念中。如果页面上的项目被AJAX调用更改，那么用户如何获得有关这些更改的通知？

Answer 1

劫持发送方法

var oldSend = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function(){
    // do what you need; then send the request
    oldSend.apply(this, arguments);
}

Answer 2

我认为您正在寻找的是DOMSubtreeModified事件。

这适用于firefox chrome和IE＆gt; = 9，如果你在facebook上编写脚本我猜它是关于greasemonkey / chrome扩展吗？如果是这样的话，这应该没问题。

在添加子节点或删除子节点时，会在节点上触发此事件

您可以将其与

一起使用

.addEventListener ("DOMSubtreeModified", handler, useCapture);

但我不认为它适用于attachEvent。

这里有更多信息。

http://help.dottoro.com/ljrmcldi.php

Answer 3

您是否可以访问正在更新页面内容的Ajax调用？通常，更好的方法是将调用附加回实际的Ajax调用。

如果使用Jquery发出请求，请使用$ .ajaxComplete（）或$ .ajaxSuccess（）来触发代码。这些将在请求完成时随时触发，因此当发生这种情况时，您可以检查内容是否已更改而不会变得昂贵。

$.ajaxSuccess(function() { //check for update and do something });