如何在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://www.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://www.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方法来对锚点标签进行操作。对于第二个示例,我们使用了onclick和window.open方法来对输入框和按钮等按钮类型进行操作。
极客笔记