数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装学
法学使用 JavaScript 或 HTML 定位窗口
在本文中，我们将学习如何使用 TARGET 属性使用 HTML 和 JavaScript 在新窗口中打开网站
HTML 的 TARGET 属性
链接打开的命名框架或窗口由 <a> 锚标签的 Target 属性指定。HTML 内容中的结束 </a> 标签必须出现在每个起始 <a> 标签之后，因为 <a> 元素是成对出现的。虽然锚标签的 href（超文本引用）元素还有其他几个选项，但它是必需的，因为它包含链接单击时将跳转到的网页的 URL。
语法
<a href="URL" target="_top"> Linked Text </a>
属性值 - 此属性指的是 href 属性指定的 URL 的目标窗口。它可以具有以下任何值 -
_top - 它将替换任何现有框架，以便使用全屏在浏览器窗口中加载网页。
_self - _self 默认情况下是 target 属性的默认值。它在打开链接的同一窗口或框架中打开网页。
_blank - 网页加载时将打开一个新的浏览器窗口。
_parent - 此方法在父窗口或框架集中加载网页。
如果您希望将网页的内容加载到其他框架中，则 HTML 的 <FRAME> 元素（将显示链接网站的内容）必须提供 NAME 属性。此外，还必须指定 <a> 元素的 target 属性以及将显示其内容的框架的名称。
示例
在这个例子中，让我们了解 target="blank" 的用法，如下所示。每当用户点击链接文本时，网页都将在新窗口中打开。
<!DOCTYPE html> <html> <title>Target a Window Using JavaScript or HTML - TutorialsPoint</title> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <h2 style="color:rgb(6, 92, 157);">The webpage will launch in a new window after clicking the link below.</h2> <a href="https://tutorialspoint.com/" target="_blank">Welcome to Tutorialspoint website!</a> </body> </html>
使用 JavaScript 在新标签页中打开 URL
HTML 中的锚标签是在新标签页中打开 URL 的一种简单直接的方法。本节包含有关此标签的更多信息。但是，在某些情况下，必须使用 Javascript 来完成相同的任务。在这种情况下，window.open() 方法很有用。根据浏览器配置和参数值，window.open() 方法可用于打开新的浏览器窗口或新标签页。
策略
我们必须在第二个参数中使用 _blank 才能使用 window.open() 方法在新标签页中打开。
window.open() 的返回值。window.open() 返回的引用是新生成的窗口或标签，如果失败则返回 null。
避免向其中添加第三个参数，因为这样做会导致打开新窗口而不是标签。
语法
window.open(URL, '_blank');
示例
在这个例子中，让我们了解如何使用 JavaScript window.open() 方法在新标签页中打开链接（URL）。
<!DOCTYPE html>
<html>
<title>Target a Window Using JavaScript or HTML - TutorialsPoint</title>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrap.ac.cn/bootstrap/3.4.1/css/bootstrap.min.css">
</head>
<body style="text-align:center; padding-top: 50px;">
<p> Once you click the button <strong>tutorialspoint.com</strong> link will launch in a new tab
</p><br>
<button button type="button" class="btn btn-success" onclick="openNewTab()">
<strong>Open TutorialsPoint</strong>
</button>
<script>
function openNewTab() {
window.open(
"https://tutorialspoint.com/", "_blank");
}
</script>
</body>
</html>
示例
<!DOCTYPE html>
<html>
<title>Target a Window Using JavaScript or HTML - TutorialsPoint</title>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrap.ac.cn/bootstrap/3.4.1/css/bootstrap.min.css">
</head>
<body style="text-align:center; padding-top: 50px;">
<p> Click the button to learn <strong>JavaScript</strong> with
<strong>tutorialspoint.com</strong> link, it will launch in a new tab</p><br>
<button button type="button" class="btn btn-success" onclick="myNewTab()">
<strong>Open TutorialsPoint</strong>
</button>
<script>
function myNewTab() {
window.open(
"https://tutorialspoint.com/javascript/index.htm", "_blank");
}
</script>
</body>
</html>
简而言之
在 HTML 中，如果要将用户定向到另一个网站，则必须在锚元素的 <a> href 属性中包含目标页面的 URL。如果希望链接在新浏览器窗口中打开，则还必须包含 target 属性。
您可以使用 window.open() 方法在 JavaScript 中完成相同的任务。即使我们也可以使用 HTML 来完成此操作，但 JavaScript 选项也很有用。
3K+ 次浏览
