如何让JavaScript标签云替换操作不局限于页面首次加载？

你的问题核心是论坛采用了单页应用（SPA）模式——页面切换时不会刷新整个页面，只会更新局部内容，所以$(document).ready只会在首次加载时执行一次，后续返回目标页面时不会触发。以下是无需定时器的优化方案，覆盖所有页面跳转场景：

1. 封装替换逻辑为独立函数 #

先把标签云替换的代码抽成单独函数，方便重复调用：

function replaceTagCloud() {
    // 注意：请确认URL是否匹配你的“Etiquettes”页面，当前代码写的是首页，可能需要调整
    if (window.location.href === "https://forum.cinestudia.fr/") {
        $('.TagsPage-content .TagCloud').replaceWith($('.TagCloud-order').html());
    }
}

2. 覆盖所有路由变化场景 #

在页脚添加以下代码，确保每次页面路由变化（包括浏览器前进/后退、论坛内部跳转）时都执行替换：

// 首次加载页面时执行
$(document).ready(replaceTagCloud);

// 监听浏览器前进/后退操作（popstate事件）
window.addEventListener('popstate', replaceTagCloud);

// 重写history.pushState和replaceState，覆盖论坛内部跳转
const originalPushState = history.pushState;
history.pushState = function(...args) {
    const result = originalPushState.apply(this, args);
    replaceTagCloud();
    return result;
};

const originalReplaceState = history.replaceState;
history.replaceState = function(...args) {
    const result = originalReplaceState.apply(this, args);
    replaceTagCloud();
    return result;
};

关键说明 #

• popstate事件：处理用户点击浏览器前进/后退按钮时的路由变化。
• 重写pushState/replaceState：论坛内部页面跳转通常会调用这两个API更新URL而不刷新页面，重写后可在每次跳转后自动触发替换逻辑。
• 请务必检查window.location.href的匹配值是否正确——你提到目标页面是“Etiquettes”，但当前代码写的是首页URL，可能需要调整为对应页面的实际地址（比如https://forum.cinestudia.fr/etiquettes）。

内容的提问来源于stack exchange，提问作者TB54