window.onload仅对数组首个页面生效，其余需刷新才隐藏指定元素的求助

看起来你的问题出在代码只执行了一次——window.onload只会在页面首次加载时触发一次，如果你的网站是单页应用（SPA），用户在不同页面之间跳转时不会刷新整个页面，后续路由变化时代码就不会重新运行，所以只有第一个匹配的页面能生效，其他页面必须刷新才能触发代码执行。

我们可以通过以下步骤修复这个问题：

1. 封装隐藏逻辑为独立函数 #

把判断URL并隐藏按钮的逻辑抽成一个单独的函数，这样可以重复调用：

function hideHelpButton() {
  const url = window.location.href;
  const targetPages = ['careers', 'accessibility', 'privacy', 'cookie-policy', 'legal', 'terms-of-business', 'sitemap', 'search'];
  
  // 检查当前URL是否包含目标页面中的任意一个
  const shouldHide = targetPages.some(page => url.includes(page));
  
  if (shouldHide) {
    // 获取所有目标元素并隐藏
    document.querySelectorAll(".embeddedServiceHelpButton").forEach(el => {
      el.style.display = 'none';
    });
  } else {
    // 可选：如果不在目标页面，恢复按钮显示（根据你的需求调整）
    document.querySelectorAll(".embeddedServiceHelpButton").forEach(el => {
      el.style.display = 'block'; // 可替换为元素原本的display值，比如inline-block等
    });
  }
}

这里用Array.some()简化了判断逻辑，只要URL包含数组中任意一个字符串就返回true，比原生循环更简洁；同时用querySelectorAll()替代getElementsByClassName()，它返回静态NodeList，遍历操作更稳定。

2. 初始加载时执行函数 #

在页面首次加载时调用这个函数，保证初始页面的按钮能正确处理：

// 页面首次加载时执行
window.onload = hideHelpButton;

3. 监听路由变化事件 #

针对单页应用的情况，我们需要监听路由变化的事件。如果是原生History API路由，可以监听popstate事件；如果是hash路由，监听hashchange事件：

// 监听浏览器前进后退的路由变化
window.addEventListener('popstate', hideHelpButton);

// 如果是hash路由，监听hash变化
window.addEventListener('hashchange', hideHelpButton);

如果你的网站用了特定框架（比如React、Vue），可以用框架自带的路由监听钩子（比如React的useLocation配合useEffect，Vue的watch监听$route），原生事件监听能覆盖大部分通用场景。

额外优化建议 #

• 如果目标元素是动态生成的（比如通过AJAX加载），可以用MutationObserver监听DOM变化，当目标元素出现时再执行隐藏逻辑。
• 建议用添加/移除CSS类替代直接修改style.display，比如定义.hidden { display: none; }，然后用el.classList.add('hidden')和el.classList.remove('hidden')控制，更符合样式与逻辑分离的原则。

这样修改后，不管是首次加载还是页面路由切换，只要进入目标页面，按钮都会自动隐藏，不需要手动刷新页面啦。

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