如何通过 js 打开一个新的浏览器窗口

最新推荐文章于 2025-07-08 09:12:21 发布

palmer_kyle

最新推荐文章于 2025-07-08 09:12:21 发布

阅读量3.3w

点赞数 6

CC 4.0 BY-SA版权

分类专栏： javascript

本文链接：https://blog.youkuaiyun.com/palmer_kai/article/details/84777181

javascript 专栏收录该内容

48 篇文章

订阅专栏

本文详细介绍了如何利用window.open方法在新标签页或新窗口打开网页，包括配置弹窗属性和利用window.opener获取源窗口对象的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Aphorism

Grow In Errors!

前言

最近肾七电池不耐用了，想想左腹就隐隐作痛，咳咳，回归正题，我就联系了下 apple 客服，准备换个电池，2018年 12.31 前更换苹果电池是有优惠政策的。在打开聊天室的时候，突然发现浏览器重新打开了窗口；又回想到了之前公司的登陆表单也是在一个小窗口中打开输入登陆信息的。嗯，强迫症来了

主要api

window.open 打开动作
window.opener 由谁打开的

打开新的 tab 和打开新的浏览器窗口

origin page

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>origin Page</title>
</head>

<body>
    i am origin page!
    <br>
    <p>
        <a href="javascript:;" onclick="jumpPage();">window.open 打开新标签页</a>
    </p>
    <p>
        <a href="http://www.w3school.com.cn" target="_blank">html方式 打开新标签页</a>
    </p>
    <p>
        <a href="javascript:;" onclick="openRequestedPopup();">window.open 打开新的浏览器窗口</a>
    </p>
    <br>
    <script>
    window.name = "origin";

    function open_win() {
        window.open("http://www.w3school.com.cn")
    }

    function jumpPage() {
        window.open("http://www.w3school.com.cn", 'hello');
    }

    var windowObjectReference;
    var strWindowFeatures = "width=1000,height=500,menubar=yes,location=yes,resizable=yes,scrollbars=true,status=true";


    function openRequestedPopup() {
        // windowObjectReference = window.open("http://www.w3school.com.cn", "CNN_WindowName", strWindowFeatures);
        windowObjectReference = window.open("./b.html", "B_page", strWindowFeatures);
  
        setTimeout(function () {
         	//windowObjectReference.close(); // 我们页面中关闭 或进行其他操作 打开的 窗口页

         	console.log(windowObjectReference.position); // 10s 后 在origin winodw 控制台 打印 B_page 视口对象中的position 成员
         }, 10000);
    }
    </script>
</body>
</html>

b page

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>b page</title>
</head>
<body>
	i am b page!
	<script>
		console.log(window.name);
		var position = "b page";
		console.log(window.opener.name); // 通过这个方法获取 源窗口对象 //  注意跨域页面是不能获取到的
	</script>
</body>
</html>