Question

我正在尝试使用Greasemonkey为Facebook的时间轴日志页面制作一个脚本。

我需要捕捉两种事件：

1）URL更改（因为更改是在Facebook上使用 AJAX 进行的，因此页面未完全重新加载，而且脚本都没有。）

2）一些元素的出现。

我尝试制作两个MutationObservers，一个用于捕获URL更改，另一个用于捕获元素外观。但它似乎只触发一个（url_mutation_observer）。

以下是我的一些代码：

function handling_url_change(mutations){
    mutations.forEach(function (mutation){
        if (check_timeline()){
            if (!buttons_added){
                var element = $(document).find(button_location);
                if (element && element.length > 0){
                    add_buttons();
                }
            }
        }else if (set){
            reset();
        }
    });
}

function handle_deletion(mutations){
    mutations.forEach(function (mutation){
        if (mutation.addedNodes){
            for (var i = 0; i < mutation.addedNodes.length; i++){
                if (isheader(mutation.addedNodes[i])){
                    mutation.addedNodes[i].remove()
                }else if (isactivity(mutation.addedNodes[i])){
                    delete_activity(mutation.addedNodes[i]);
                }
                return true;
            }
        }
    });
    return true;
}

/*
** Mutation observers :
*/

var url_mutation_observer = new MutationObserver(handling_url_change);

var delete_mutation_observer = new MutationObserver(handle_deletion);

我有一些问题：

1）每个MutationObserver都不会捕获每个突变吗？

2）添加一个按钮（就像我的脚本一样）是否算作突变？

3）如果我添加一个带有回调函数的元素，该函数由添加这样的元素触发。是否存在递归和无限循环的风险？

4）是否可以仅使用MutationObserver捕获URL更改，并仅捕获某些元素与另一个元素的外观？（为了确保每个人只捕获他需要捕获的东西，我不知道该怎么做，我用检查页面的函数检查了url，而没有用函数检查突变是否是“UrlChangeMutation”或类似的东西）。

5）我该怎么办？

NB：如果您也需要，这里是调用console.log()调用的完整脚本。 http://dpaste.com/3NWV08J

NB2：如果您还希望此脚本没有console.log()调用： http://dpaste.com/3AH8YF5

Answer 1

首先请注意，您的for循环已损坏，因为它包含无条件return true。

1）每个MutationObserver都没有捕获每个突变吗？

是的，因为您正在观察document。

2）添加一个按钮（就像我的脚本一样）是否算作突变？

当然。

3）如果我添加一个带有回调函数的元素，该函数由添加这样的元素触发。不存在递归和无限循环的风险吗？

绝对。
（虽然这将是一个非阻塞循环，这意味着页面可能不会冻结。）

4）是否可以通过MutationObserver [...]来捕获URL更改？

不，那不是MutationObservers所做的。来自MDN：

MutationObserver为开发人员提供了一种对DOM中的更改做出反应的方法。

请注意，＆＃34; UrlChangeMutation或类似的内容＆＃34; 不存在。

4）[...]并且只用另一种元素捕捉某些元素的外观？

您无法指定过滤器，但可以检查受影响的元素是否符合回调函数中的条件地狱，你可以访问每个节点的所有方法和属性，你还需要什么？

5）我该怎么办？

我的建议？谷歌更多。
例如，网址上的＆＃34; javascript的第一个结果是＆＃34;是：

How to detect url change

我建议你阅读DOM，因为你似乎根本不知道那里存在很多东西。

Answer 2

我遇到了错误：observer.observer()不是一个功能。 observer.observe()是：http://dpaste.com/3AH8YF5#line-254

是否可以同时运行两个MutationObservers？

2 个答案: