Target _blank in all Link

Question

I've just made an html page with target _self

But now I have too many links and I want to change all link targets to _blank and it's hard for me to do. Is there is any javascript which apply on all just to write 1 time ??

Because my code is too long and it is taking too many times to change in all links. Is there is any trick?

like this

<a href="http://www.google.com"></a>
<a href="http://www.facebook.com"></a>
<a href="http://www.gmail.com"></a>
<a href="http://www.twitter.com"></a>
<a href="http://www.stackoverflow.com"></a>
<a href="http://plus.google.com"></a>

What program are you using to write your html? The obvious way would be a find and replace... — Liath, Jun 26 '14 at 10:49
No problem for stupid question. I would handle this situation with a better editor, like Sublime Text. In Sublime Text, you would do: 1. Search for "href" 2. Click on "Find all", which selects all "href" results. 3. write your "target" before the "href" — Olav Kokovkin, Jun 26 '14 at 10:50
noo i dont want to replace is there is any javascipt which open all links in blank? — Hammad, Jun 26 '14 at 10:51
Btw the link URLs in your example are incorrect...they should start with http:// — Matt Browne, Jun 26 '14 at 10:51
I'm confident the answer is in here: http://stackoverflow.com/search?q=%5Bjavascript%5D+open+links+in+tab — PeeHaa, Jun 26 '14 at 10:53
You shouldn't try to use javascript as a find-and-replace substitute. — Thom Wiggers, Jun 26 '14 at 11:06
@ThomWiggers's comment is definitely true. I'm hoping that there's some good reason that the links need to not actually have a `target` attribute in the HTML, otherwise you really should change your HTML. — Matt Browne, Jun 26 '14 at 11:13

score 46 · Accepted Answer · edited Jan 11 '22 at 01:10

46

Put this in your <head>:

<base target="_blank">

It will make all URLs on a page open in a new page, unless target is specified.

This is a HTML5-only feature, I learned it from Google's io-2012-slides slide package.

edited Jan 11 '22 at 01:10

Mario Petrovic

7,500
14
42
62

answered Jun 26 '14 at 10:51

Thom Wiggers

6,938
1
39
65

I don't know, why don't you try? It will not update the rendered HTML code, however... – Thom Wiggers Jun 26 '14 at 11:00
Are you using HTML5? Also it might not get executed since `` was already executed at page load. Just put the code into your page's `` and you shouldn't have to change the `target` on URLs anymore. – Thom Wiggers Jun 26 '14 at 11:04
FYI the default behavior is `target="_self"` – Chase Roberts Dec 08 '17 at 00:19

score 8 · Answer 2 · edited Aug 20 '19 at 12:08

8

To answer your question, jQuery makes this easy:

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<script>
    $(function() {
        $('a[href]').attr('target', '_blank');
    });
</script>

This will not modify any <a> tags without an href attribute.

edited Aug 20 '19 at 12:08

Thom Wiggers

6,938
1
39
65

answered Jun 26 '14 at 10:51

Oliver Spryn

16,871
33
101
195

@Hammad It should work... try this example: http://jsfiddle.net/spryno724/Hh4S6/ You probably don't have jQuery loaded or your not waiting for your document to load before changing the `target` attributes. – Oliver Spryn Jun 26 '14 at 11:02

Matt Browne · Answer 3 · 2020-03-23T18:07:52.920

2

It's pretty simple in plain JS too:

var links = document.getElementsByTagName('a');
for (var i=0, len=links.length; i < len; i++) {
  links[i].target = '_blank';
}

(Put this script right before your closing </body> tag or in any case after all the <a> tags on your page.)

edited Mar 23 '20 at 18:07

answered Jun 26 '14 at 11:02

Matt Browne

12,169
4
59
75

Fr0zenFyr · Answer 4 · 2014-06-26T11:05:49.383

1

If you are unable to do a simple find and replace using your HTML editor, you can do something like this using jQuery:

$('a').click(function() {
  $(this).attr('target', '_blank');
});

This will automatically do a target="_blank" for every a that is clicked and open in a new window or new tab(you have no control over this, it depends on user's browser settings).

FIDDLE

Hope this helps!!

edited Jun 26 '14 at 11:05

answered Jun 26 '14 at 10:55

Fr0zenFyr

1,899
2
28
48

Its important to add jquery 2.1.0 ? – Hammad Jun 26 '14 at 11:06
Probably because you didn't put the script at the bottom of your page (before the closing `
` tag) or alternatively inside a `$(document).ready()` callback.
– Matt Browne Jun 26 '14 at 11:06
Note that the jQuery 2.x branch does not support IE 8 and below. – Matt Browne Jun 26 '14 at 11:07
Also note that unlike the other answers here, this answer doesn't change the target until someone actually clicks on a link, so it should appear before any of your other JS code that might set up `click` events on links (unless none of those other JS links [if you have any] need to actually open in a new window/tab). – Matt Browne Jun 26 '14 at 11:09
@Hammad Not necessary, any recent version of jQuery should work. But having a jQuery include is required. Though, 2.X may not work below IE8, it's good for other browsers. The code is jQuery code which you need to put in a `$(document).ready(function(){ //...code here..});` inside `script` tags. – Fr0zenFyr Jun 26 '14 at 11:10

score 1 · Answer 5 · answered Jul 03 '14 at 18:10

I've had to deal with this lots of times. Just for the record:

I think there's no need to make javascript perform this task, but here's another approach, instead you can use the find/replace function of your editor and do something like this (provided your links are in that format):

Open your editor and look for <a href:
On the replace field type <atarget="_blank"href.
Replace.

Or you can append that to the end of the tag by looking for .com"> and replacing it for .com" target="_blank">. You can do this on all editors that have the find/replace feature. It's just a matter of finding patterns and how to replace them.

Target _blank in all Link

5 Answers5

FIDDLE

Linked