js打开html文件怎么打开新窗口打开

今天想和大家分享一个超实用的小技巧，那就是在JavaScript中如何实现打开HTML文件时，在新窗口中打开，相信这个问题困扰了不少前端开发者，那么接下来,就让我来为大家详细讲解一下吧！

我们要明确一点，JavaScript作为一种客户端脚本语言，有着强大的功能，可以实现很多有趣的交互效果，而今天我们要讲的内容，就是利用JavaScript中的window.open()方法来实现新窗口打开HTML文件。

话不多说,让我们开始吧！

第一步：创建HTML文件

我们需要准备一个HTML文件，这里以example.html为例，在这个文件中，我们可以随意编写一些内容,如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>示例页面</title>
</head>
<body>
    <h1>欢迎来到示例页面！</h1>
</body>
</html>

第二步：编写JavaScript代码

我们需要在另一个HTML文件中编写JavaScript代码，用来打开刚才创建的example.html文件，假设我们有一个index.html文件,代码如下：

js打开html文件怎么打开新窗口打开

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>主页</title>
</head>
<body>
    <button onclick="openNewWindow()">在新窗口中打开示例页面</button>
    <script>
        function openNewWindow() {
            // 这里就是我们要讲解的重点
            window.open('example.html', '_blank');
        }
    </script>
</body>
</html>

在上面的代码中，我们创建了一个按钮，并为其添加了一个点击事件，当按钮被点击时，会触发openNewWindow()函数，在这个函数中，我们使用了window.open()方法,该方法有两个参数：