Question

我的页面上有一个链接

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

目标是遵循此链接（在新选项卡中打开）并更改其属性（在上一个选项卡上）。我的意思是我们在新标签页面中打开google.com，如果我们回头查看链接，则会刷新。

我试过这个js代码

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

但它也改变了新开标签的目标。而不是打开谷歌它在我的例子中打开Facebook。

是否可以修复它？

Answer 1

你的onclick在href之前触发，所以它会在打开页面之前发生变化，你需要让函数像这样处理窗口打开：

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

点击

后，您可以使用setTimeout延迟执行代码

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

Answer 3

替换

onclick="changeLink();"

通过

onclick="changeLink(); return false;"

取消默认操作

Answer 4

您可以在页面load中更改此内容。

我的意图是当页面进入load功能时，切换链接（所需链接中的当前链接）

Answer 5

例如试试这个：

<a href="http://www.google.com" id="myLink1">open link 1</a><br/> <a href="http://www.youtube.com" id="myLink2">open link 2</a>




    document.getElementById("myLink1").onclick = function() {
    window.open(
    "http://www.facebook.com"
        );
        return false;
      };

      document.getElementById("myLink2").onclick = function() {
    window.open(
    "http://www.yahoo.com"
        );
        return false;
      };

Answer 6

利用mousedown侦听器用新的URL位置修改href属性，然后让浏览器确定应重定向到的位置是否有缺点？

到目前为止，对我来说一切正常。想知道这种方法的局限性吗？

// Simple code snippet to demonstrate the said approach
const a = document.createElement('a');
a.textContent = 'test link';
a.href = '/haha';
a.target = '_blank';
a.rel = 'noopener';

a.onmousedown = () => {
  a.href = '/lol';
};

document.body.appendChild(a);
}

如何在新窗口中打开链接后使用JavaScript更改href属性？

6 个答案: