window对象方法（open和close）

小鱼儿 2023-07-18 06:13 1阅读 0赞

# window对象 #

语法：

window.open(pageURL,name,parameters)

功能：

打开一个新的浏览器窗口或查找一个已命名的窗口

参数说明：

pageURL：子窗口路径  
name：子窗口句柄（name声明了新窗口的名称，方便后期通过name对子窗口进行引用）  
parameters：窗口参数（各参数用逗号隔开）  
        width：窗口宽度  
        height：窗口高度  
        left：窗口X轴坐标  
        top：窗口Y轴坐标  
        toolbar：是否显示浏览器的工具栏  
        menubar：是否显示浏览器的菜单栏  
        scrollbars：是否显示滚动条  
        location：是否显示地址字段  
        status：是否添加状态栏

语法：

window.close()

功能：

关闭浏览器窗口

--------------------

# 选择练习 1 #

关于window对象的open方法，下列说法正确的是？（选择两项）

**A** open方法用于打开一个新的浏览器窗口或查找一个已命名的窗口  
**B** open方法打开的窗口宽和高都是固定的，无法进行改变  
**C** 通过open方法中参数的设置可以重新设定窗口的特征，可以对打开的新窗口的宽和高等进行改变  
**D** 如果open中的url参数为空的话，那么没有窗口被打开

**正确答案： A,C**  
参考解析：  
该题考察的是window对象的open方法，正确选项为AC；  
1、open方法用于打开一个新的浏览器窗口或查找一个已命名的窗口  
2、通过open方法中参数的设置可以重新设定窗口的特征，可以对打开的新窗口的宽和高等进行改变  
3、如果open方法中的url参数为空的话，那么新窗口也会被打开只是不会显示任何文档

--------------------

# 选择练习 2 #

通过window对象的open方法打开了一个子窗口，想让子窗口的滚动条不被显示，通过设置哪个属性可以实现？（选择一项）

**A** menubar : no  
**B** scrollbars=no  
**C** menubar=no  
**D** scrollbars : no

**正确答案： B**  
参考解析：  
该题考察的是window对象open方法的窗口特征设置，正确选项为B；  
通过open方法中的scrollbars属性，可以规定子窗口是否要显示滚动条，默认值是yes，如果不现实，值是no，属性和属性值之间用等号连接。

--------------------

# 编程练习 #

实现：当点击页面上的按钮时，弹出确认框  
（1） 当点击按钮上的确定时，打开设置了新特征的子窗口, 新窗口的特征参考任务栏中的描述  
（2） 当点击按钮上的取消时，关闭当前页面  
（本题因为涉及到两个窗口，请在本地浏览器运行并查看效果！）

#### 任务 ####

第一步：获取到按钮元素，并为按钮绑定鼠标单击事件  
下面的步骤皆在单击事件中进行  
第二步：当点击按钮时，弹出确认框，用if判断对确认框返回的值进行判断  
（1） 返回的值为true时，说明点击的是确认，打开新的窗口“newPage.html”，用open()方法，新窗口的特征如下：  
①宽300，高300  
②窗口距离屏幕上边200，距离屏幕左边600  
③窗口不显示地址字段、菜单栏、滚动条以及状态栏  
（2）返回值是false为false时，表示点击的是“取消”按钮，当前页面被关闭，用close（）方法。

#### 参考代码 ####

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title>打开/关闭页面</title>
    	</head>
    	<body>
    		<input type="button" name="" value="打开页面" />
    		<script type="text/javascript"> window.onload=function(){ var btn=document.getElementsByTagName("input")[0]; btn.onclick=function(){ var result=window.confirm("是否打开页面"); if(result==true){ window.open("newPage.html","newPage","width=300,height=300,left=600,top=200,toolbar=no,menubar=no,scrollbars=no,location=no,status=no"); } if(result==false){ window.close(); } } } </script>
    	</body>
    </html>