如何用JavaScript高效移除URL查询字符串？

2024-03-18 20:20:04

用JavaScript移除URL中的查询字符串

当我们访问一个网站时，URL通常包含一个查询字符串，其中包含附加信息，例如页面参数或跟踪数据。有时候，我们需要获取没有查询字符串的URL，这在构建干净的URL或进行进一步处理时非常有用。本文将探索使用JavaScript从URL中移除查询字符串的各种方法。

使用split()方法

最简单的方法是使用split()方法，它将URL拆分为两个部分：基础URL和查询字符串。然后，我们取第一个部分，因为它不包含查询字符串。

const url = 'http://example.com/page.php?id=123';
const urlWithoutQueryString = url.split('?')[0];
console.log(urlWithoutQueryString); // 输出：http://example.com/page.php

使用URLSearchParams接口

URLSearchParams接口允许我们直接与查询字符串交互。我们可以使用delete()方法删除特定参数，然后使用toString()方法获取修改后的URL。

const url = new URL('http://example.com/page.php?id=123');
url.searchParams.delete('id');
const urlWithoutQueryString = url.toString();
console.log(urlWithoutQueryString); // 输出：http://example.com/page.php

使用正则表达式

正则表达式可以用来匹配和替换字符串中的模式。我们可以使用正则表达式来移除查询字符串，但这种方法比其他方法更复杂。

const url = 'http://example.com/page.php?id=123';
const urlWithoutQueryString = url.replace(/\?.*$/, '');
console.log(urlWithoutQueryString); // 输出：http://example.com/page.php