How to change href attribute using JavaScript after opening the link in a new window?

Question

I have a link on my page

<a href="http://google.com" id="mylink" onclick="changeLink();" target="_blank">google</a> 

And the goal is to follow this link (opening in a new tab) and change its attributes (on previous tab). I mean we open google.com in a new tab and if we look back on the link, it's refreshed.

I've tried this js code

function changeLink(){     document.getElementById("mylink").href = "http://facebook.com";     document.getElementById("mylink").innerHTML = "facebook";     } 

But it also changes the target of new opening tab. Instead of opening google it opens facebook in my example.

Is it possible to fix it?

Answer 1

Your onclick fires before the href so it will change before the page is opened, you need to make the function handle the window opening like so:

function changeLink() {     var link = document.getElementById("mylink");      window.open(       link.href,       '_blank'     );      link.innerHTML = "facebook";     link.setAttribute('href', "http://facebook.com");      return false; } 

Answer 2

You can delay your code using setTimeout to execute after click

function changeLink(){     setTimeout(function() {         var link = document.getElementById("mylink");         link.setAttribute('href', "http://facebook.com");         document.getElementById("mylink").innerHTML = "facebook";     }, 100); }