在Web开发中，获取当前页面的URL是一个常见的操作，它可以帮助我们实现诸如页面导航、数据验证等多种功能。JavaScript 提供了多种方法来获取页面的URL。以下是一些简单且实用的方法：
1. 使用 window.location.href
window.location.href 属性可以获取当前页面的完整URL。这是一个非常直接的方法，几乎适用于所有场景。
// 获取当前页面的URL
var currentUrl = window.location.href;
console.log(currentUrl);
2. 使用 window.location.pathname
如果你想获取URL中的路径部分，可以使用 window.location.pathname。
// 获取URL中的路径部分
var path = window.location.pathname;
console.log(path);
3. 使用 window.location.search
如果需要获取URL中的查询字符串部分，可以使用 window.location.search。
// 获取URL中的查询字符串部分
var queryParams = window.location.search;
console.log(queryParams);
4. 使用 window.location.hash
window.location.hash 可以获取URL中的锚点部分。
// 获取URL中的锚点部分
var hash = window.location.hash;
console.log(hash);
5. 使用 URL 对象
ES6 引入了 URL 对象，它提供了一种更现代、更强大的方式来处理URL。
// 使用URL对象获取URL的各个部分
var url = new URL(window.location.href);
console.log(url.href); // 完整URL
console.log(url.pathname); // 路径部分
console.log(url.search); // 查询字符串部分
console.log(url.hash); // 锚点部分
6. 使用 URLSearchParams 对象
如果你需要处理查询字符串，URLSearchParams 对象是一个非常有用的工具。
// 获取查询参数
var params = new URLSearchParams(window.location.search);
console.log(params.get('paramName')); // 获取特定参数的值
总结
这些方法可以帮助你轻松获取页面的URL及其各个部分。根据你的具体需求，选择最合适的方法即可。记住，JavaScript 提供了丰富的API来帮助开发者处理各种Web开发任务。