在现代开发中，我们经常需要获取当前网页的URL来完成各种操作，例如页面重定向、参数解析等。在URL的处理上，JavaScript提供了一系列强大且便捷的工具。这篇文章将详细讲解如何使用JavaScript获取当前页面的URL，并分解URL的各个组成部分。

使用JavaScript获取完整的URL

获取当前页面的完整URL是我们进行下一步开发的基础。最简单的方法如下：

javascript">var currentURL = window.location.href;
console.log(currentURL);

window.location.href属性可以返回当前页面的完整URL，包括协议、主机名、路径、查询字符串和锚点（hash）。

URL的结构

在深入了解获取URL的技术细节之前，让我们先看看URL的基本结构：

<protocol>//<hostname>:<port>/<pathname><search><hash>

• protocol: 指定访问资源所用的协议，如http或https。
• hostname: 主机名，表示资源所在的服务器主机名，如www.stackoverflow.com。
• port: 端口号，指定服务器的特定端口，缺省时为协议的默认端口。
• pathname: 路径，表明资源在主机中的具体位置，如/index.html。
• search: 查询字符串，提供给服务器的附加信息，通常以参数形式出现。
• hash: 符号#开始的锚点，通常用于页面内部导航。

访问和操作URL

JavaScript提供了多种方法来访问和操作URL的各个组成部分。所有这些方法都依赖于Location对象。下面是每个主要Location对象属性的解释：

获取并解析URL组件

javascript">var locationObj = window.location;console.log("完整URL: " + locationObj.href); // 完整的URL
console.log("协议: " + locationObj.protocol); // 协议
console.log("主机名: " + locationObj.hostname); // 主机名
console.log("端口: " + locationObj.port); // 端口号
console.log("路径: " + locationObj.pathname); // 路径名
c