Userscript 仅适用于从后端提供的页面，但不适用于 SPA 方式的前端

Question

我运行在 Greasemonkey/Tampermonkey 上有以下用户脚本。

我运行它在 facebook.com 上提供一些来自后端的网页，在引导过程中，还有一些在运行中，在前端，通过 HRO，就像一个单页应用程序 (SPA) 会。

// ==UserScript==
// @name        facebook
// @namespace   nms
// @include     http://*.facebook.com/*
// @include     https://*.facebook.com/*
// @version     1
// @grant       none
// ==/UserScript==

setTimeout( () => {
    // generalStuff:
        document.querySelectorAll(' #left_nav_section_nodes, .fbChatSidebar ').forEach( (e)=> {
            e.style.visibility = "hidden";
        });

}, 1000);

如果我在控制台上运行这个脚本，即使在基于 HRO 的网页中，它运行没问题，但是当运行从 Greasemoneky/Tampermonkey 中删除时它不会运行在这些特定网页中。

我怎样才能使脚本在类似 SPA 的网页上也能正常工作？

Answer 1

在这种情况下 setTimeout、setInterval 和事件委托本身不起作用，可以将实现它们的状态推送到内存中，然后替换现有的状态，这样网页的 DOM 内容就会改变。

这是一个代码，用于替换使用 AJAX 而不是直接从 PHP 加载的数据：

let utilityFunc = ()=> {
    var run = (url)=> {
       // insert your code here
    };

    var pS = window.history.pushState;
    var rS = window.history.replaceState;

    window.history.pushState = function(a, b, url) {
        run(url);
        pS.apply(this, arguments);
    };

    window.history.replaceState = function(a, b, url) {
        run(url);
        rS.apply(this, arguments);
    };

utilityFunc();

这是我阅读 here 的理解。

Userscript 仅适用于从后端提供的页面，但不适用于 SPA 方式的前端

Userscript works only on pages served from backend, but not on frontend in a SPA way

javascript

ajax

console

userscripts

single-page-application