window.open

前言

在开发中，我们常常需要在新的window或者tab页打开一个页面或者问价（文件阅览或下载），这时候我们就需要用到window.open;

window.open(url, windowName, windowFeatures)

一、参数

window.open接受三个参数；

1. url

打开的窗口中要加载的url;

可以是一个HTML页面，或者文件的预览或下载地址。

url允许传空值

• 非空值：打开一个新窗口

window.open('http://localhost:3000/#/first', 'first')

• 空值：获取一个窗口的引用（第二个参数不能为空）

// 通过窗口名，获取该窗口
let first = window.open('', 'first')

2. windowName

该参数是被打开的窗口的名字

它并不是窗口的标题。该参数只是一个窗口标识，用于以后通过它来找到对应的窗口的引用。

该参数除了支持普通的名字外，还支持和a标签一样的特殊关键字：

• _self：当前窗口
• _blank：空白窗口
• _parent：父窗口
• _top：顶级窗口

当传入了已经被使用过的窗口的名字时，不会新打开一个窗口，而是在该名字对应的窗口中打开，该窗口之前加载的内容会被替换。

3. windowFeatures

窗口参数描述

字符串类型，各个参数由逗号隔开，参数之间以等号连接

let url = 'http://localhost:3000/#/first'
window.open(url, 'first', 'top=100,left=100,width=200,height=200')

结果

• left：新窗口相对于当前浏览器页面左侧的距离
• top：新窗口相对于浏览器页面顶部的位置，注意，不是相对于文档区域，而是整个浏览器页面
• width：窗口的宽度（包含滚动条），单位像素，最小值100
• height：窗口内容区（即用户区，不包含工具栏、标签栏等）的高度，单位像素，最小值100。

二、返回值

window.open返回的是对新打开的窗口的引用，即该窗口的window对象：

let url = 'http://localhost:3000/#/first'
let object = window.open(url, 'first')
console.log(object);

截屏