【学习笔记】JavaScript打开新窗口（window.open）与关闭窗口（window.close）

打开新窗口（window.open）
语法：

window.open([URL], [窗口名称], [参数字符串])

参数说明:
URL：可选参数，在窗口中要显示网页的网址或路径。如果省略这个参数，或者它的值是空字符串，那么窗口就不显示任何文档。
窗口名称：可选参数，被打开窗口的名称。

1.该名称由字母、数字和下划线字符组成。
2."_top"、"_blank"、"_self"具有特殊意义的名称。
   _blank：在新窗口显示目标网页
   _self：在当前窗口显示目标网页
   _top：框架网页中在上部窗口中显示目标网页
3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。

4.name 不能包含有空格。
参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。
参数有width，height，top（窗口顶部离开屏幕顶部的像素数），left，menubar（窗口有无菜单），toolbar（窗口有无工具条），scrollbars（窗口有无滚动条），status（窗口有无状态条）
例：例如:打开https://douyeblog.top网站，大小为500px * 300px，无菜单，无工具栏，无状态栏，无滚动条窗口：

<script type="text/javascript"> window.open('https://douyeblog.top','_blank','width=500px,height=300px,menubar=no,toolbar=no, status=no,scrollbars=no')
</script>

点击按钮打开（使用函数）

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>window.open</title>
<script type="text/javascript">
  function Wopen(){
window.open('https://douyeblog.top','_blank','width=500px,height=200px,menubar=no,toolbar=no, status=no,scrollbars=yes')


  } 
</script>
</head>
<body>
<input name="button" type="button" onClick="Wopen()" value="点击我，打开新窗口!"  >
</body>
</html>

2.关闭窗口
语法
window.close(); //关闭本窗口
<窗口对象>.close(); //关闭指定的窗口（窗口对象储存在变量中）
例:关闭新建的窗口

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>window.open</title>
<script type="text/javascript">
   var mywin=window.open('https://douyeblog.top'); //将新打的窗口对象，存储在变量mywin中
  function Closemywin(){ mywin.close();}
</script>
</head>
<body>
<input name="button" type="button" onClick="Closemywin()" value="点击我，关闭新窗口!"  >
</body>
</html>

【学习笔记】JavaScript打开新窗口（window.open）与关闭窗口（window.close）

评论(0)