Window open() 方法

JavaScript Window 对象

open()方法打开一个新的浏览器窗口,并加载指定的文件进去。

如果为指定的文档创建了一个新窗口,则可以通过open()方法的features参数来修改其外观和行为。

使用close()方法关闭窗口。

语法:

window.open(url, name, features, replace)
window.open("https://www.nhooo.com");
测试看看‹/›

浏览器兼容性

所有浏览器完全支持open()方法:

方法
open()

参数值

参数描述
url(可选)需要打开的网页的URL。如果未设置URL,则window.open()方法将打开一个空白窗口
name(可选)指定窗口的名称或目标属性。
可能的值:
  • _blank -URL已加载到新窗口中(默认)

  • _parent -URL已加载到父框架

  • _self -URL替换当前页面

  • _top -URL替换可能加载的所有框架集

  • name -窗口名称

features(可选)以逗号分隔的项目列表,没有空格。
可能的值:
channelmode =是|否| 1 | 0 是否以剧院模式显示窗口。默认为否。仅IE
directories=yes|no|1|0  过时的 是否添加目录按钮。默认为是。仅IE
fullscreen=yes|no|1|0  是否以全屏模式显示浏览器。默认为否。全屏模式下的窗口也必须处于剧院模式。仅IE
height=pixels  窗口的高度。最小值为100
left=pixels  窗口的左侧位置。不允许负值
location=yes|no|1|0  是否显示地址字段。仅限Opera
menubar=yes|no|1|0  是否显示菜单栏
resizable=yes|no|1|0  窗口是否可调整大小。仅IE
scrollbars=yes|no|1|0  是否显示滚动条。仅限IE,Firefox和Opera
status=yes|no|1|0  是否添加状态栏
titlebar=yes|no|1|0  是否显示标题栏。除非调用应用程序是HTML应用程序或受信任的对话框,否则将被忽略
toolbar=yes|no|1|0  是否显示浏览器工具栏。仅限IE和Firefox
top=pixels  窗口的顶部位置。不允许负值
width=pixels  窗口的宽度。最小值为100
replace(可选)指定URL创建新条目或替换历史记录列表中的当前条目。
可能的值:
  • true-URL替换历史记录列表中的当前文档

  • false-URL在历史记录列表中创建一个新条目

技术细节

返回值:表示新创建的窗口的Window对象。如果无法打开窗口,则返回值为null。

更多示例

在新窗口中打开空白页:

window.open("", "", "width=400, height=300");
测试看看‹/›

打开一个新窗口。使用name属性返回新窗口的名称:

var win = window.open("", "popupWindow", "width=400, height=300");
win.document.write("<p>This window's name is: " + win.name + "</p>");
测试看看‹/›

在指定高度和宽度的新窗口中打开“ parrot-tutorial.com”:

window.open("https://www.nhooo.com", "", "width=400, height=300");
测试看看‹/›

在指定位置的新窗口中打开“ parrot-tutorial.com”:

window.open("https://www.nhooo.com", "", "left=500, top=200");
测试看看‹/›

打开一个新窗口并指定其外观:

window.open("https://www.nhooo.com", "_blank", 
"toolbar=yes,scrollbars=yes,resizable=yes,top=200,left=500,width=400,height=300");
测试看看‹/›

打开一个新窗口,并使用close()方法关闭新窗口:

var popupWindow;

//打开新窗口的函数
function windowOpen() {
  popupWindow = window.open("https://www.nhooo.com", "_blank");
}

// 关闭打开的窗口的函数
function windowClose() {
  if (popupWindow) {
 popupWindow.close();
  }
}
测试看看‹/›

使用opener属性返回对创建新窗口的窗口的引用:

// 打开一个新窗口
var win = window.open("", "popupWindow", "width=300, height=200");

//在新窗口写入一些内容
win.document.write("<p>这个窗口的名称是: " + win.name + "</p>");

// 在创建新窗口的窗口中写入一些文本
win.opener.document.write("<h1>这是源窗口!</h1>");
测试看看‹/›

相关参考

窗口(Window)参考:close()方法

窗口(Window)参考:closed属性

窗口(Window)参考:opener属性

JavaScript Window 对象