如何使用 vanilla javascript 以编程方式更改 location.href 的值？

Question

我有这样的按钮：

<button type="button" class="play-now-button" onclick="location.href='www.yahoo.com'">Play Now</button>

但是，我想使用 vanilla js 更改location.href的值。 我下面的内容不起作用。 我在网上看了一些建议，但无济于事。 我究竟做错了什么？

let playButton = document.getElementsByClassName("play-now-button")[0];
playButton.onclick.location.href = "www.google.com";

我也试过：

playButton.onclick = function() {
   this.location.href = "www.google.com"
}

但这些都不起作用。 我需要使用按钮。 我不想使用<a>标签，因为我想保持样式。 我也尝试在button内嵌套a标签，但也无济于事。

我做错了什么，我该如何解决？

Answer 1

window.location.href = "www.blabla.com";

// or

window.location.href = "/mysite/some-page";

Answer 2

这在这里不起作用，因为此代码在 iframe 中，在您的主文档中使用它会在那里工作。

 let playButton = document.getElementsByClassName("play-now-button")[0]; playButton.onclick = function(e) { window.location.assign('https://www/google.com') }

 <button class="play-now-button">Open Another Link</button>

Answer 3

this将是执行处理程序时的 HTMLButtonElement。

你需要对你的代码做一个小的改动。

playButton.onclick = function() { window.location.href = "www.google.com" }