在 Web 开发中，打开新的页面是一个非常常见的需求，而使用 JavaScript 又可以方便地实现这个功能。然而，不同的浏览器可能会有不同的实现方式，而且有时候也需要处理一些兼容性问题。为了方便处理这些问题，可以使用 npm 包 open-new-page。
open-new-page 是什么
open-new-page 是一个 npm 包，它提供了一个简单的 API，方便打开新的页面以及处理一些与兼容性相关的问题。它是基于 window.open() 函数实现的。
如何使用
首先，你需要在你的项目中安装 open-new-page：
--- ------- ------------- ------
安装完成后，你可以使用 CommonJS 的方式来引入这个模块：
--- ----------- - -------------------------
或者使用 ES6 的方式来引入：
------ ----------- ---- ----------------
然后，你就可以使用它提供的 API 来实现打开新页面的功能了。
open(url, options)
这是 open-new-page 最常用的 API，可以用来打开一个新的页面。
--------------------------------------------
如果你想要设置一些参数，可以传递第二个参数 options，它是一个对象。这里列出了一些常用的参数（参考自 MDN 文档）：
left,top,width,height：指定新窗口的位置和大小；menubar,toolbar,location,status,resizable,scrollbars：指定是否显示对应的 UI；noopener：指定新窗口不能访问来源窗口的 window 对象；opener：指定新窗口的 opener，也就是来源窗口的 window 对象。
------------------------------------------- - ----- ---- ---- ---- ------ ---- ------- ---- -------- ------ -------- ------ --------- ------ ------- ------ ---------- ------ ----------- ----- --------- ----- ------- ------ ---
需要注意的是，由于浏览器的安全限制，某些参数可能会被强制忽略。
isSupported()
这个 API 可以用来检测当前浏览器是否支持 window.open() 函数。
-- --------------------------- - -- -- - ---- - -- --- -
openBlank()
这个 API 可以用来打开一个空白的样式简单的页面。它没有参数，也没有返回值。
------------------------
注意事项
- 由于浏览器的安全限制，你不能在没有用户交互的情况下打开新的页面。这意味着，你不能在页面加载完成后自动打开新页面，也不能在 setTimeout 函数中打开新页面。如果你需要这样的功能，你需要跟用户交互，比如在按钮点击事件中打开新页面。
- 使用 window.opener 可能会存在一些安全问题，你需要谨慎使用。
示例代码
--- ----------- - -------------------------
-- ------ ------------- --
-- --------------------------- -
-- -------
------------------------------------------- -
----- ----
---- ----
------ ----
------- ----
-------- ------
-------- ------
--------- ------
------- ------
---------- ------
----------- -----
--------- -----
------- ------
---
-- ---------
------------------------
-来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600570bd81e8991b448e7fec