js获取url参数并跳转

在JavaScript中获取URL参数并进行页面跳转，可以通过以下步骤实现：

一、获取URL参数

1. 使用URLSearchParams对象（推荐方式，适用于现代浏览器）：
2. 使用URLSearchParams对象（推荐方式，适用于现代浏览器）：
3. 使用正则表达式或字符串操作（兼容性更好，但代码较复杂）：
4. 使用正则表达式或字符串操作（兼容性更好，但代码较复杂）：

二、页面跳转

获取到参数后，可以使用window.location.href进行页面跳转：

// 假设我们要跳转到 https://example.com/redirected-page?param1=value1&newParam=newValue
const newUrl = `https://example.com/redirected-page?param1=${encodeURIComponent(param1)}&newParam=newValue`;
window.location.href = newUrl;

三、完整示例

假设当前页面URL为 https://example.com/page?param1=value1&param2=value2，我们想跳转到 https://example.com/redirected-page 并携带 param1 和一个新的参数 newParam：

// 获取URL参数
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const param1 = urlParams.get('param1');

// 构建新的URL并进行跳转
const newUrl = `https://example.com/redirected-page?param1=${encodeURIComponent(param1)}&newParam=newValue`;
window.location.href = newUrl;

四、常见问题及解决方法

1. 参数不存在：
   • 在获取参数时，始终检查返回值是否为null。
   • 在获取参数时，始终检查返回值是否为null。

• URL编码问题：
  • 使用encodeURIComponent对参数值进行编码，确保URL格式正确。
  • 使用encodeURIComponent对参数值进行编码，确保URL格式正确。
• 浏览器兼容性：
  • URLSearchParams在现代浏览器中广泛支持，但如果需要兼容旧版浏览器，可以使用正则表达式或字符串操作的方法。

通过以上方法，你可以轻松地在JavaScript中获取URL参数并进行页面跳转。