javascript - 使用 jQuery 更新现有的 URL 查询字符串值

Question

假设我有一个 url，例如:

http://www.example.com/hello.png?w=100&h=100&bg=white

我想做的是更新 w 和 h 查询字符串的值，但保持 bg 查询字符串不变，例如:

http://www.example.com/hello.png?w=200&h=200&bg=white

那么读取查询字符串值(它们可以是任何一组查询字符串值，而不仅仅是 w、h 和 bg)、更新一些值或不更新任何值并返回完整 url 的最快最有效的方法是什么使用新的查询字符串？

所以:

1. 获取每个查询字符串键的值
2. 更新任意数量的键
3. 用新值重建 url
4. 保留所有其他未更新的值
5. 它不会有一组标准的已知 key ，它可以根据 URL 更改

Answer 1

简单的解决方案

您可以使用 URLSearchParams.set() 如下所示:

var currentUrl = 'http://www.example.com/hello.png?w=100&h=100&bg=white';
var url = new URL(currentUrl);
url.searchParams.set("w", "200"); // setting your param
var newUrl = url.href; 
console.log(newUrl);

Online demo (jsfiddle)