在前端开发中，经常需要从当前网页的 URL 中获取路径和查询字符串。JavaScript 提供了一些内置方法来实现这个功能。
获取路径
要获取当前网页的路径，可以使用 window.location.pathname 属性。该属性返回当前 URL 中的路径部分，不包括主机名、协议和查询字符串。例如：
// 当前 URL 为 https://www.example.com/path/to/page.html?key=value const path = window.location.pathname; console.log(path); // 输出 /path/to/page.html
如果需要去掉路径中的文件名和扩展名，可以使用正则表达式或字符串方法来处理。例如：
const pathWithoutExtension = path.replace(/\.[^/.]+$/, ""); console.log(pathWithoutExtension); // 输出 /path/to/page
获取查询字符串
要获取当前网页的查询字符串，可以使用 window.location.search 属性。该属性返回当前 URL 中的查询字符串部分，以问号（?）开头。例如：
// 当前 URL 为 https://www.example.com/path/to/page.html?key=value const queryString = window.location.search; console.log(queryString); // 输出 ?key=value
如果需要将查询字符串解析成对象，可以使用自己编写的函数或第三方库（如 query-string）。以下是一个简单的示例：
-- -------------------- ---- ------- -------- ----------------------------- - ----- ------ - --- -- ------------- - -------------------------------------------- -- - ----- ----- ------ - ---------------- ----------- - -------------------------- --- - ------ ------- - ----- ------ - ------------------------------ -------------------- -- -- - ---- ------- -展开代码
总结
本文介绍了如何使用 JavaScript 获取当前网页的路径和查询字符串。通过这些方法，可以方便地获取 URL 中的重要信息，并用于实现各种功能，如路由、搜索等。同时，我们也提供了一些示例代码和解析查询字符串的函数，希望对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27582
