(共566篇)
全部分类

打开或关闭新窗口
[ JS基础 ] 

打开或关闭新窗口

打开一个新窗口

widnow.open(url [, windowName, setting])函数用来告诉浏览器打开一个新窗口。比如说:

1
2
3
<script>
    window.open("./demo02.html");
</script>

案例源码

页面打开后,浏览器会打开一个新的窗口,窗口的网址是./demo02.html;

参数 url

url用来设置新窗口的网址,可以是本地的一个文件地址,也可以是网络上的一个地址,比如:

1
2
3
4
5
6
7
<script>
    // 在新窗口中打开百度
    window.open("http://www.baidu.com");

    // 在新窗口中打开本地的一个图片文件
    window.open("../images/01.png");
</script>

案例源码

参数 windowName

windowName用来设置新窗口的name属性,也就是新窗口的名字。没有设置的时候是空字符串""

1
2
3
4
<!-- demo03.html -->
<script>
    window.open("./demo04.html", "new window demo04");
</script>

案例源码

参数 setting

setting参数中可以设置新窗口的一些属性,常见的有:

1
2
3
4
5
6
7
<script>
    window.open(
        "./demo04.html",
        "new window demo04",
        "width=300,height=300,left=30,top=30,resizable=no",
    );
</script>

案例源码

返回值

window.open()方法返回新窗口的一个引用对象,通过引用对象,可以获取新窗口的一些属性,比如获取新窗口的名称(name 属性),或者修改新窗口的网址。这些属性会在后面一一讲解。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<script>
    var newWindow = window.open("./demo04.html", "new window demo04");

    console.log("新窗口的name属性值是:", newWindow.name);

    // 这是一个定时器,表示2秒后,修改新窗口的网址,跳转到demo02.html
    setTimeout(function() {
        newWindow.location.href = "./demo04.html";
    }, 2000);
</script>

案例源码

关闭窗口

close()方法用来关闭当前窗口,或者关闭新打开的窗口。

1
2
3
4
5
6
// 关闭当前窗口
window.close();

// 关闭刚打开的新窗口
var newWindow = window.open("./demo04.html", "new window demo04");
newWindow.close();

案例源码