欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

target _blank_HTML target =“ _ blank”链接示例教程

程序员文章站 2022-04-29 23:33:51
...
target _blank_HTML target =“ _ blank”链接示例教程

target _blank

HTML provides the <a> element or tag in order to create links to the other pages, URL, or part of the same page. While creating a link we can set the style of the link like open in the same browser tab or page or in a new browser window or tab. We can open given link in a new browser window or tab by using the target="_blank" attribute of the <a> element.

HTML提供了<a>元素或标签,以便创建指向其他页面,URL或同一页面一部分的链接。 创建链接时,我们可以设置链接的样式,例如在同一浏览器选项卡或页面中或在新的浏览器窗口或选项卡中打开。 我们可以使用<a>元素的target="_blank"属性在新的浏览器窗口或标签中打开给定链接。

为什么在新窗口或选项卡中打开链接 (Why Open A Link In A New Window or Tab)

There are some good reasons to open a link in a new window or tab.

有一些很好的理由在新窗口或新标签页中打开链接。

  • There may a user-initiated media playing like a video or sound. Opening a link on the same page will interrupt the user’s media experience.

    可能有用户启动的媒体像视频或声音一样播放。 在同一页面上打开链接将中断用户的媒体体验。
  • The user is working on the page and changing page will cause loss of work or data.

    用户正在页面上工作,更改页面会导致工作或数据丢失。

为什么不在新窗口或选项卡中打开链接 (Why Not Open A Link In A New Window or Tab)

Well, there are some reasons which make the opening a link in a new browser tab or window.

嗯,有一些原因使打开新浏览器选项卡或窗口中的链接成为可能。

  • The first reason is that we like to open links in a new window or tab. The default behavior of the link is opening in the same window or tab without creating a new one. This can be a bad reason where users generally stick to the default behavior with links.

    第一个原因是我们喜欢在新窗口或新标签页中打开链接。 链接的默认行为是在同一窗口或选项卡中打开而不创建新窗口或选项卡。 这可能是一个糟糕的原因,因为用户通常会坚持使用链接的默认行为。
  • The second reason maybe we do not want our users to leave our web site by creating multiple windows or tabs for our web page. This can be related to branding.

    第二个原因也许是我们不希望用户通过为我们的网页创建多个窗口或标签来离开我们的网站。 这可能与品牌塑造有关。
  • The third reason is processing internal and external links differently. We can behave the external links differently and open then in a new tab or window.

    第三个原因是内部和外部链接的处理方式不同。 我们可以改变外部链接的行为,然后在新的标签或窗口中打开。
  • The fourth reason is providing a download link like a PDF.

    第四个原因是提供了PDF之类的下载链接。
了解更多如何在HTML中添加图像?

具有<a>元素HTML链接 (HTML Link with <a> Element)

The HTML <a> link element with target="_blank" is supported by all major modern web browsers like Google Chrome, Microsoft Edge, Internet Explorer, Mozilla Firefox, Safari, and Opera. The syntax of the target="_blank" is like below.

所有主要的现代网络浏览器(例如Google Chrome,Microsoft Edge,Internet Explorer,Mozilla Firefox,Safari和Opera)都支持带有target="_blank"HTML <a>链接元素。 target="_blank"的语法如下。

<a href=URL target="_blank">
  • `URL` is the new address, URL or web page we want to open in a new browser window or tab.

    “ URL”是我们要在新的浏览器窗口或标签中打开的新地址,URL或网页。

使用_blank在新窗口或选项卡中打开链接 (Open Link In A New Window or Tab with _blank)

We will use the target="_blank" attribute in the following example where the given href value or URL https://www.poftut.com will be opened in a new tab or window.

在以下示例中,我们将使用target="_blank"属性,其中将在新选项卡或窗口中打开给定的href值或URL https://www.poftut.com

<a href="https://www.poftut.com" target="_blank">

target =“ _ blank”与target =“ _ new” (target=”_blank” vs target=”_new”)

In some examples we can see that target="_new" is used with a similar function with target="_blank". According to standards like HTML, HTML 5, HTML 4 etc there is no attribute like target="_new". But modern browsers provide applications about the target="_new" even not a standard. Both attributes will function like the same where target="_new" will search for the tab with the name new and if not found new tab or window will be created and the link URL will be loaded.

在某些示例中,我们可以看到target="_new"target="_blank"类似的功能一起使用。 根据HTML,HTML 5,HTML 4等标准,没有诸如target="_new"类的属性。 但是现代的浏览器提供了有关target="_new"应用程序,甚至不是标准的应用程序。 这两个属性的作用相同,其中target="_new"将搜索名称为new的选项卡,如果找不到,将创建新的选项卡或窗口,并加载链接URL。

安全目标=“ _ blank” (Secure target=”_blank”)

The newly opened window or tab can be changed with the window.opener.location to some phishing age. The user trust the opened page as he will think that the page is genuine. We can stop this type of attacks and secure the target="_blank" attributed links with the rel="nooper noreferrer" attribute like below.

可以使用window.opener.location将新打开的窗口或选项卡更改为某个网络钓鱼年龄。 用户信任打开的页面,因为他会认为该页面是真实的。 我们可以停止这种类型的攻击,并使用rel="nooper noreferrer"属性来保护target="_blank"属性链接,如下所示。

<a href="https://www.poftut.com" target="_blank" rel="noopener noreferrer">

翻译自: https://www.poftut.com/html-target_blank-link-tutorial-with-examples/

target _blank