How to open link in new tab on html?

2019-01-01 10:16发布

问题:

I\'m working on an HTML project, and I can\'t find out how to open a link in a new tab without javascript.

I already know that <a href=\"http://www.WEBSITE_NAME.com\"></a> opens the link in same tab. Any ideas how to make it open in a new one?

回答1:

Set the \'target\' attribute of the link to _blank:

<a href=\"#\" target=\"_blank\">Link</a>

Edit: for other examples, see here: http://www.w3schools.com/tags/att_a_target.asp

(Note: I previously suggested blank instead of _blank because, if used, it\'ll open a new tab and then use the same tab if the link is clicked again. However, this is only because, as GolezTrol pointed out, it refers to the name a of a frame/window, which would be set and used when the link is pressed again to open it in the same tab).



回答2:

Use one of these as per your requirements.

Open the linked document in a new window or tab:

 <a href=\"xyz.html\" target=\"_blank\"> Link </a>

Open the linked document in the same frame as it was clicked (this is default):

 <a href=\"xyz.html\" target=\"_self\"> Link </a>

Open the linked document in the parent frame:

 <a href=\"xyz.html\" target=\"_parent\"> Link </a>

Open the linked document in the full body of the window:

 <a href=\"xyz.html\" target=\"_top\"> Link </a>

Open the linked document in a named frame:

 <a href=\"xyz.html\" target=\"framename\"> Link </a>

See MDN



回答3:

If you would like to make the command once for your entire site, instead of having to do it after every link. Try this place within the Head of your web site and bingo.

<head>
<title>your text</title>
<base target=\"_blank\">
</head>

hope this helps



回答4:

Use target=\"_blank\":

<a href=\"http://www.example.com/\" target=\"_blank\">This will open in a new window!</a>


回答5:

target=\'_blank\' if you are not using XHTML.



回答6:

Use the \"target\" attribute of the a tag and assign it to _blank. That is:

<a href=\"http://www.google.com\" target=\"_blank\" >Google in a New Tab or Window depending on the browser\'s capabilities</a>


回答7:

When to use target=\'_blank\' :

The HTML version (Some devices not support it):

<a href=\"http://chriscoyier.net\" target=\"_blank\">This link will open in new window/tab</a>

The JavaScript version for all Devices :

The use of rel=\"external\" is perfectly valid

<script type=\"text/javascript\" src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js\"></script>
<script type=\"text/javascript\">
    $(\'a[rel=\"external\"]\').attr(\'target\', \'_blank\');
</script>

and for Jquery can try with the below one:

$(\"#content a[href^=\'http://\']\").attr(\"target\",\"_blank\");

If browser setting don\'t allow you to open in new windows :

href = \"google.com\";
onclick=\"window.open (this.href, \'\'); return false\";


回答8:

target=\"_blank\" attribute will do the job. Just don\'t forget to add rel=\"noopener noreferrer\" to solve the potential vulnerability. More on that here: https://dev.to/ben/the-targetblank-vulnerability-by-example

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


回答9:

You can use <a href=\"#\" target=\"_blank\">Your Text</a> Hope it helped. Thanks.



回答10:

You can use <a href=\'url\' target=\"_blank\">name</a>

Example <a href=\'https://www.facebook.com/hackbalteamz\' target=\"_blank\">Facebook</a>



回答11:

Default opens in same tab:

<a href=\"https://www.google.com/\">Google.com </a>

Opens in new tab:

<a href=\"https://www.google.com/\" target=\"_blank\">Google.com </a>


回答12:

target=\"_blank\" always opens a new tab for each click and target=\"tabName\" opens a new tab, but same for each click.