javascript - 如何从 url 中删除参数？

Question

我使用了以下代码，因此我可以向网址添加多个参数

    <script>
        function setParam(name, value) {
            var l = window.location;

            /* build params */
            var params = {};        
            var x = /(?:\??)([^=&?]+)=?([^&?]*)/g;        
            var s = l.search;
            for(var r = x.exec(s); r; r = x.exec(s))
            {
                r[1] = decodeURIComponent(r[1]);
                if (!r[2]) r[2] = '%%';
                params[r[1]] = r[2];
            }

            /* set param */
            params[name] = encodeURIComponent(value);

            /* build search */
            var search = [];
            for(var i in params)
            {
                var p = encodeURIComponent(i);
                var v = params[i];
                if (v != '%%') p += '=' + v;
                search.push(p);
            }
            search = search.join('&');

            /* execute search */
            l.search = search;
        }
    </script>

<a href="javascript:setParam('priceMin', 300);">add priceMin=300</a>

<a href="javascript:setParam('priceMin', 600);">add priceMin=600</a>

<a href="javascript:setParam('MaxDistance', 300);">add MaxDistance=300</a>

这取自问题:How to add a parameter to the URL?

但是，需要添加什么额外的脚本，以便如果您再次单击相同的超链接，它将删除网址中的参数？在本例中为“?priceMin=300”

Answer 1

Javascript已经有URL对象。如果你想要什么，你可以附加参数像这样。

 const newUrl = new URL(window.location.href);

function setParam(name, value, option = 'add') {
    var paramexist = newUrl.searchParams.has(name);
    if (option == 'remove') {
        newUrl.searchParams.delete(name);
        return newUrl;
    }
    (!paramexist) ? newUrl.searchParams.append(name, value) : newUrl.searchParams.set(name, value);
    return newUrl;
}

console.log(setParam('priceMin', 300));
console.log(setParam('priceMin', 300,'remove'))