如何提前检测JavaScript中window.close()是否可正常执行？

先帮你梳理下核心问题：你想准确判断当前窗口是否允许用window.close()关闭，从而决定是否显示关闭按钮，但之前用window.opener的判断逻辑漏了「右键新标签页打开单页面」这种场景——这类窗口的window.opener是null，但因为会话历史只有一个Document，属于规范里的script-closable，所以window.close()是有效的。

先回顾规范里的生效条件 #

根据HTML规范，window.close()能生效必须满足：当前窗口是script-closable，且脚本有权操作该窗口。而script-closable包含两种场景：

• 由脚本创建的窗口（比如通过window.open()打开的）
• 会话历史仅包含一个Document的窗口（比如右键新标签页打开的单个页面、地址栏直接输入打开的单页面）

可靠的检测逻辑 #

结合上述规范，我们可以同时检测两种script-closable的情况，写出判断函数：

function isWindowClosable() {
  // 检测是否是脚本打开的窗口
  const openedByScript = window.opener !== null;
  // 检测会话历史是否只有一条记录
  const singleHistoryEntry = window.history.length === 1;
  
  // 满足任一条件即可关闭
  return openedByScript || singleHistoryEntry;
}

用法示例 #

// 假设你的关闭按钮ID是close-window-btn
const closeBtn = document.getElementById('close-window-btn');
if (isWindowClosable()) {
  closeBtn.style.display = 'block';
  // 绑定关闭事件
  closeBtn.addEventListener('click', () => window.close());
} else {
  closeBtn.style.display = 'none';
}

为什么这个逻辑有效？ #

• 对于脚本打开的窗口：window.opener会指向打开它的父窗口，所以openedByScript为true
• 对于右键新标签页打开的单页面：window.opener是null，但history.length为1，所以singleHistoryEntry为true
• 对于用户导航过多个页面的窗口：history.length大于1，且window.opener为null，返回false，不会显示关闭按钮

这个逻辑覆盖了所有规范允许window.close()生效的场景，在Chrome、Firefox、Edge等主流浏览器都能正常工作。

内容的提问来源于stack exchange，提问作者Eduardo Ponce de Leon