弹窗(popup),在浏览器中打开一个新的窗口

语法

window.open(url, name, params)

  • url:新窗口中加载的 URL
  • name:新窗口的名称
  • params:新窗口的配置

默认是打开一个新的标签页,如果提供了窗口大小那么将打开一个新窗口

只在用户触发的事件中生效:

// 弹窗被阻止
window.open('');
 
// 弹窗被允许
button.onclick = () => {
  window.open('');
}

Warning

JavaScript 无法最小化或者最大化一个窗口。这些操作系统级别的功能对于前端开发者而言是隐藏的

  • 访问弹窗:调用的返回值是对新窗口的引用,可以用来操纵新弹窗。(只有在窗口是同源的时,窗口才能自由访问彼此的内容)
  • 从弹窗访问窗口:可以使用 window.opener 来访问打开该窗口的源窗口,如果一个窗口不是被 open 出来的,那么 window.opener 返回 null
  • 关闭弹窗:win.close() 如果 window 不是通过 window.open() 创建的,那么大多数浏览器都会忽略 window.close()。因此,close() 只对弹窗起作用
  • 窗口的聚焦/失焦:可以监听 window.onblurwindow.onfocus 事件来获取当前页面的聚焦状态
  • window.open 打开的同源窗口共享 sessionStorage