javascript - 网站打开新页面时如果已存在则切换到现有的页面，否则重新打开一个页面，这要怎么实现？

Question

比如我点击某个链接要打开a页面，要判断是否存在已打开的a页面，这步我使用postMessage来实现通讯，可以实现判断是否已打开，但是要怎么切换到已打开的a页面吗？

Answer 1

可以尝试利用window.open方法两个参数 （url,name）var examplePage = window.open("", "examplePage");//判断当前name的网页是否存在 if (examplePage) {  examplePage.focus();//存在聚焦跳转} else {  //不存在就打开新页面  examplePage = window.open("https://www.example.com", "examplePage");}

Answer 2

web API 只能做到监听，做不到主动切换

如果是 chrome 插件开发，可以尝试 chrome tabs

change-chrome-tab-with-javascript

Answer 3

要实现这个功能，你可以使用HTML的窗口对象（window object）和JavaScript。你可以通过检查窗口对象的属性来检查是否已经打开了一个页面，并根据需要切换到已打开的页面。

你可以使用 window.open() 函数来打开一个新的页面，并使用 window.name 属性来给新窗口指定一个名字。然后，你可以使用 window.getComputedStyle(window) 来检查当前窗口的名字是否和你打开的新窗口的名字相同，从而判断是否已经打开了一个页面。

如果你想切换到已打开的页面，你可以使用 window.open() 函数传入已经打开的窗口的名字作为第一个参数，并且设置第二个参数为 true，这样就可以强制切换到已打开的窗口。

下面是一个简单的示例代码：

function openOrSwitchToPage(url) {  // 获取当前窗口的名字  const currentWindowName = window.name;  // 尝试切换到已打开的窗口  try {    const existingWindow = window.open('', currentWindowName, 'noopener');    existingWindow.opener = null; // 设置打开者为空，避免报安全警告    existingWindow.location = url; // 切换到已打开的窗口的地址    return; // 已经切换到已打开的窗口，直接返回  } catch (e) {    // 忽略异常，继续打开新页面  }  // 如果没有已打开的窗口，打开新页面  window.open(url, currentWindowName, 'noopener');}

在这个示例中，我们首先尝试切换到已打开的窗口。如果无法切换到已打开的窗口（可能是因为同源策略的限制或者其他原因），我们就打开一个新的窗口。在打开新的窗口时，我们指定了窗口的名字为当前窗口的名字，这样就可以在以后快速切换到这个窗口。