js 获取当前href

在JavaScript中,你可以通过window.location.href来获取当前页面的URL。下面是一个简单的例子:

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

上述代码获取当前页面的完整URL,并将其存储在currentURL变量中。然后,通过console.log语句将其打印到控制台,以便查看。

如果你只希望获取URL的某些部分,比如路径或查询参数,可以使用window.location对象的其他属性,例如:

  • window.location.protocol:获取协议部分(例如:"http:"或"https:")。
  • window.location.host:获取主机部分(例如:"www.example.com")。
  • window.location.pathname:获取路径部分(例如:"/path/page.html")。
  • window.location.search:获取查询参数部分(例如:"?key1=value1&key2=value2")。
  • window.location.hash:获取片段标识符部分(例如:"#section")。

例如:

var protocol = window.location.protocol;
var host = window.location.ho
<think>我们正在处理的是如何在JavaScript获取当前页面的URL路径。根据引用内容,我们可以使用`window.location`对象来获取URL的各个部分。以下是具体的方法: 1. **获取完整的URL**:使用`window.location.href`可以返回完整的URL地址,包括协议、主机名、路径和查询参数等[^1][^4][^5]。 2. **获取主机名和端口**:`window.location.host`返回主机名和端口(如果有的话)[^5]。 3. **获取端口号**:`window.location.port`返回端口号[^5]。 4. **获取路径部分**:`window.location.pathname`返回URL的路径部分,即主机名之后、查询参数之前的部分[^5]。 5. **获取查询参数**:`window.location.search`返回查询参数部分,包括问号?[^5]。 6. **使用`document.URL`**:也可以使用`document.URL`来获取完整的URL,与`window.location.href`相同[^5]。 因此,要获取当前页面的URL路径(即路径部分),我们可以使用`window.location.pathname`。 示例: 假设当前页面的完整URL是:`http://localhost:8080/products/index.html?category=books&id=123` - `window.location.pathname` 将返回:`/products/index.html` 如果我们需要获取完整的URL,则使用`window.location.href`。 另外,引用[3]提到还可以使用`URLSearchParams`来解析查询参数,但这里我们只关注路径部分,所以不需要解析查询参数。 所以,获取当前页面URL路径的代码是: ```javascript var path = window.location.pathname; ``` 如果我们需要获取当前页面的完整URL,则使用: ```javascript var fullUrl = window.location.href; ``` 注意:这些属性都是只读的,不能通过赋值来改变当前URL。要改变当前URL,可以使用`window.location.assign(url)`或`window.location.replace(url)`等方法。 总结: - 获取路径部分:`window.location.pathname` - 获取完整URL:`window.location.href` 下面是一个简单的示例,展示如何获取并打印这些信息: ```javascript console.log("完整URL: " + window.location.href); console.log("路径部分: " + window.location.pathname); ``` 这样,我们就可以在JavaScript获取当前页面的URL路径了。 §§相关问题§§ 1. JavaScript中如何修改当前页面的URL? 2. 如何使用JavaScript获取URL中的查询参数并解析? 3. 如何使用JavaScript重定向到另一个页面?</think>### JavaScript 获取当前页面 URL 路径的完整指南 在 JavaScript获取当前页面的 URL 路径主要通过 `window.location` 对象实现,该对象提供了多种属性来获取 URL 的不同部分。以下是具体方法和使用场景: #### 1. **获取完整 URL** 使用 `window.location.href` 返回包含协议、域名、路径和查询参数的完整 URL: ```javascript const fullUrl = window.location.href; // 示例:https://www.example.com/products/index.html?id=123&category=books ``` #### 2. **获取路径部分** 使用 `window.location.pathname` 获取域名后的路径部分(不含查询参数): ```javascript const path = window.location.pathname; // 示例:/products/index.html ``` #### 3. **获取查询参数** 使用 `window.location.search` 获取问号 `?` 后的查询字符串: ```javascript const query = window.location.search; // 示例:?id=123&category=books ``` #### 4. **获取主机信息** ```javascript const host = window.location.host; // 示例:www.example.com:8080 const hostname = window.location.hostname; // 示例:www.example.com const port = window.location.port; // 示例:8080 const protocol = window.location.protocol; // 示例:https: ``` #### 5. **URL 组件解析** 使用 `URL` API 更精细地解析 URL: ```javascript const url = new URL(window.location.href); console.log(url.pathname); // 路径:/products/index.html console.log(url.searchParams.get("id")); // 获取参数值:123 ``` #### 6. **实际应用示例** ```javascript // 检查当前是否在特定页面 if (window.location.pathname.includes("/admin")) { console.log("管理员页面"); } // 获取并解析查询参数 const urlParams = new URLSearchParams(window.location.search); const productId = urlParams.get("id"); // 123 ``` #### 注意事项: 1. **路径格式**:`pathname` 始终以斜杠 `/` 开头 2. **编码处理**:包含特殊字符的路径需使用 `decodeURIComponent()` 解码 3. **兼容性**:`URLSearchParams` 在 IE 中不支持,需使用 `polyfill` > 关键公式: > 完整 URL = $protocol + // + host + pathname + search$[^1]
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值