JavaScript 按钮转到 URL

在网站开发中，经常需要给用户提供一些按钮来完成不同的操作。其中，按钮的一个常见作用就是跳转到指定的 URL。在 JavaScript 中，我们可以使用不同的方法来实现该功能。

使用 window.location.href

最常用的一种跳转方式是使用 window.location.href 属性。该属性可以获取或设置当前页面的地址。于是，我们可以将它设置为目标 URL，来实现跳转的目的。

document.getElementById("myButton").addEventListener("click", function() {
  window.location.href = "http://www.example.com";
});

上述代码中，我们先使用 getElementById 方法获取一个 ID 为 myButton 的按钮，然后给它添加一个 click 事件监听器。当按钮被点击时，它会将页面跳转到 http://www.example.com 这个 URL。

使用 location.replace

除了 window.location.href 属性之外，我们也可以使用 location.replace 方法来完成页面跳转操作。该方法会在浏览器历史记录中生成一个新的记录，覆盖当前页面的记录。

document.getElementById("myButton").addEventListener("click", function() {
  location.replace("http://www.example.com");
});

与前面的例子类似，我们同样是在按钮点击事件中调用了 location.replace 方法。它的作用是将页面跳转到 http://www.example.com 这个 URL，同时会在浏览器的历史记录中生成一个新的记录。

使用 location.assign

除了上述方法之外，我们还可以使用 location.assign 方法来实现页面的跳转。它的作用与 window.location.href 属性相似，也是将页面跳转到指定的 URL。

document.getElementById("myButton").addEventListener("click", function() {
  location.assign("http://www.example.com");
});

上述代码中，我们给 ID 为 myButton 的按钮添加了一个点击事件监听器。当点击该按钮时，它会调用 location.assign 方法，将页面跳转到 http://www.example.com 这个 URL。

总结

以上就是 JavaScript 实现按钮跳转至 URL 的三种方法。我们可以根据具体的需求来选择不同的实现方式。无论哪种方法，都可以轻松完成页面的跳转操作。