JS获取当前路由

JS获取当前路由

在前端开发中，我们经常需要获取当前页面的路由信息，以便进行一些操作或者展示相关内容。本文将详细讨论在JavaScript中如何获取当前路由的方法。

1. 使用window.location

JavaScript中可以通过window.location对象来获取当前页面的URL信息，包括路由、参数等。我们可以通过window.location.pathname来获取当前页面的路由信息。下面是一个示例代码：

console.log(window.location.pathname);

以上代码将会输出当前页面的路由信息。

2. 使用window.location.href

除了window.location.pathname外，我们也可以通过window.location.href来获取当前页面的完整URL地址。如果我们只需要获取路由信息，可以通过一些处理来截取得到。示例代码如下：

const url = window.location.href;
const router = url.split('/').pop();
console.log(router);

以上代码将会输出当前页面的路由信息。

3. 使用URL对象

除了之前提到的两种方法，我们还可以使用URL对象来解析当前页面的URL信息。URL对象提供了一系列属性来获取URL的各个部分，包括协议、主机、路径等。下面是一个示例代码：

const urlObj = new URL(window.location.href);
console.log(urlObj.pathname);

以上代码也将会输出当前页面的路由信息。

4. 使用location对象

除了前面提到的方法，我们还可以使用location对象来获取当前页面的路由信息。window.location和document.location都是指向location对象的引用，我们可以直接使用location.pathname来获取当前页面的路由信息。示例代码如下：

console.log(location.pathname);

以上代码同样将会输出当前页面的路由信息。

5. 总结

通过以上介绍，我们学习了几种在JavaScript中获取当前路由的方法。不同的方法可能有一些微小的差异，开发者可以根据实际情况选择适合自己的方法来获取路由信息。