location.href的几种用法

location.href的简介

location.href 是一个只读属性，它返回或设置当前文档的 URL，这个属性在 JavaScript 中非常常用，可以用来获取或修改当前页面的网址，本文将详细介绍 location.href 的几种用法。

获取当前页面的网址

1、直接使用 location.href

var currentUrl = location.href;
console.log(currentUrl);

2、使用 window.location.href

var currentUrl = window.location.href;
console.log(currentUrl);

这两种方法都可以用来获取当前页面的网址，但它们之间有一些区别。location.href 是 DOM 接口的一个属性，而 window.location.href 是窗口对象的一个属性，在大多数情况下，它们的结果是相同的，但在某些特殊情况下，如通过框架加载页面时，它们可能会有所不同，建议使用 window.location.href。

修改当前页面的网址

1、使用 window.history.pushState() 和 window.history.replaceState() 方法

这两个方法可以用来修改当前页面的 URL,而不会导致页面刷新，它们的使用方法如下：

// 向浏览器历史记录添加一条新记录，同时修改当前页面的 URL
window.history.pushState("", "", "/new-url");
// 用新的内容替换当前页面的历史记录条目，同时修改当前页面的 URL
window.history.replaceState("", "", "/new-url");

2、使用 location.assign() 方法

这个方法可以用来修改当前页面的 URL,并导致页面刷新，它的使用方法如下：

location.assign("/new-url");

跳转到其他页面

1、使用 window.open() 方法打开一个新窗口或标签页，并在新窗口或标签页中加载指定的 URL。

window.open("https://www.example.com", "_blank");

2、使用 window.location.href 在当前窗口中加载指定的 URL。

window.location.href = "https://www.example.com";

相关问题与解答

1、如何获取当前页面的域名？

答：window.location.hostname 可以用来获取当前页面的域名。

var domain = window.location.hostname;
console.log(domain); // 输出当前页面的域名，如 "www.example.com"

2、如何判断当前页面是否为 HTTPS?

答：可以通过检查 window.location.protocol 的值来判断当前页面是否为 HTTPS，如果值为 "https:",则表示当前页面为 HTTPS;否则表示为 HTTP。

if (window.location.protocol === "https:") {
  console.log("当前页面为 HTTPS");
} else {
  console.log("当前页面为 HTTP");
}