Open link in a new tab — JavaScript

Opening a link in a new tab has to be a calculated decision as it partially breaks the flow thus impacting user experience. But, it is also important to use this when the information on the new page is either short-lived or something that the user want to see, but at the same time continue scrolling the current page.

This method can be used in any JavaScript project or any JavaScript oriented libraries (React) or frameworks (Angular).

Using <a> tag

Using target attribute of the anchor tag can be used to open the link in new tab.

The target attribute specifies where to open the link. Possible values for the attribute are:

1. _blank : Opens in new tab
2. _self : Opens in the current tab (default)

There are other possible values for target attribute. Please see here or here.


We will be using the `window` object of JavaScript.

The catch here is that if the user has blocked pop-ups in his/her browser, then this might not work. The browser does show a warning. If the user allows to show pop-up windows for your domain, it will start working again.

Originally published on

Programmer and a voracious reader who writes about web development and personal finance |