如何在JavaScript中模拟target="_blank"？

onclick事件仅在用户点击元素时发生，它是一个纯JavaScript属性。每当你点击onclick事件时，它都会执行一些操作，例如显示消息或将用户重定向到另一个页面。 在网站中应尽量减少onclick事件的使用，因为它可能会让用户感到困惑。因此，请谨慎使用此事件。

window.open()方法用于在新窗口或浏览器标签页中打开链接或网页。它受所有著名的浏览器支持，例如Chrome、Firefox和Opera。window.open()是JavaScript的预定义方法。它完全取决于浏览器的设置和分配给参数的值。

在本文中，我们将学习如何在JavaScript中模拟target=”_blank”。

语法

以下是window.open()方法的语法：

window.open(URL, name, specs, replace)

参数

  • URL − 指定需要在新标签页中打开的页面的URL。如果未定义URL，则会打开一个空白的新标签页。

  • name − 用于设置窗口名称。

  • specs − 用于分隔项目，用逗号分隔，不留空格。

  • replace − 它创建一个新条目或替换当前列表。

以上所有参数都是可选的。

步骤

按照以下步骤在JavaScript中模拟点击：

步骤1 − 在body部分，我们定义了标题、锚点和脚本元素。

步骤2 − 对于锚点元素，定义了blankFun()方法。使用此方法，当我们点击链接时，链接将在新标签页中打开。

步骤3 − 使用window.open方法设置链接在新窗口标签页中打开。

步骤4 − 点击链接后，将触发onClick事件函数，它将在新窗口标签页中打开链接。

示例

在这个例子中，我们将看到每当我们点击按钮时如何计算点击次数。

<html> 
   <body> 
   <h2>Simulate target="_blank" in JavaScript</h2>
   <a href="#" onclick="blankFun()">Link will open in the new window</a>
   <script>
      function blankFun() {
         window.open('https://tutorialspoint.com/', '_blank');
      }
   </script>
   </body> 
</html>

示例

让我们看看另一个在JavaScript中模拟target="_blank"的示例。这里，我们将使用输入和按钮类型以及window.open方法。

<html> 
   <body> 
      <h2>Simulate target="_blank" for various types of buttons using JavaScript </h2>
      <input type="button" onclick="windowTab('https://tutorialspoint.com/')" value="submit">
      <br><br>
      <button type="button" onclick="newWindow('https://www.tutorix.com/')">click here</button>

      <script>
         function windowTab(url) {
            window.open(url, '_blank');
         }
            function newWindow(url) {
            window.open(url, '_blank');
         }
      </script>
   </body> 
</html>

结论

在本文中，我们成功地解释了如何使用JavaScript以及示例来模拟target="_blank"。我们使用了两个不同的示例，在第一个示例中，我们对锚标签使用了onclick事件和window.open方法。在第二个示例中，我们对像input和button这样的按钮类型使用了onclick和window.open方法。

更新于：2023年2月24日

6000+ 浏览量

启动您的职业生涯

通过完成课程获得认证

开始学习
广告