HTML DOM URL 属性

window.location

window.location 对象包含有关当前 URL 的信息。我们可以使用它来获取当前页面的 URL 地址、协议、主机名、端口号、路径和查询参数等信息。

下面是一些常用的 window.location 属性：

• href: 获取当前页面的完整 URL 地址。
• protocol: 获取当前页面的协议（http 或 https）。
• host: 获取当前页面的主机名和端口号。
• hostname: 获取当前页面的主机名。
• port: 获取当前页面的端口号。
• pathname: 获取当前页面的路径部分。
• search: 获取当前页面的查询参数部分。
• hash: 获取当前页面的哈希部分。

示例代码：

console.log(window.location.href);
console.log(window.location.protocol);
console.log(window.location.host);
console.log(window.location.hostname);
console.log(window.location.port);
console.log(window.location.pathname);
console.log(window.location.search);
console.log(window.location.hash);

document.URL

document.URL 属性用于获取当前文档的 URL 地址。它与 window.location.href 的效果是一样的，都可以获取当前页面的完整 URL 地址。

示例代码：

console.log(document.URL);

location.href

location.href 属性也可以用来获取当前页面的完整 URL 地址。与 window.location.href 和 document.URL 的效果是一样的。

示例代码：

console.log(location.href);

修改 URL 地址

除了获取 URL 地址外，我们也可以使用 window.location 对象来修改页面的 URL 地址，实现页面的跳转。

示例代码：

// 跳转到百度首页
window.location.href = "https://www.baidu.com";

总结

在本文中，我们介绍了一些常用的 HTML DOM URL 属性，包括 window.location、document.URL 和 location.href。这些属性可以帮助我们获取和操作页面的 URL 地址，实现一些常见的网页操作。希望本文对你有所帮助！