Как удалить URL-адрес с несколькими параметрами с помощью javascript?

#javascript #jquery

Вопрос:

Я создаю функцию для удаления более 1 параметров без перезагрузки с помощью replaceState. Я создал функцию ниже, и эта функция работает, но только для 1 параметра.

Если на другой странице у меня есть более 1 параметра, который я хочу удалить, как мне это сделать? Я хочу, чтобы эта функция работала для всех страниц. Кто-нибудь может мне помочь?

 function removeURLParameter(url, parameter) {
    var urlparts = url.split('?');  
 
    if (urlparts.length >= 2) {

       var prefix = encodeURIComponent(parameter)   '=';
       var pars = urlparts[1].split(/[amp;;]/g);

       for (var i = pars.length; i-- > 0;) {    
          if (pars[i].lastIndexOf(prefix, 0) !== -1) {  
             pars.splice(i, 1);
          }
       }

       return urlparts[0]   (pars.length > 0 ? '?'   pars.join('amp;') : '');
    }
    return url;
}

$(document).ready(function(){
  const url = "http://localhost:8088/products/10?param1=key1amp;param2=key2amp;param3=key3amp;param4=key4"
  const removeURLParams = removeURLParameter( url, 'param3')
  
  console.log(url)
  console.log(removeURLParams)
}) 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 

Ответ №1:

Вот гораздо более простой подход:

Вы можете использовать параметры rest, чтобы разрешить вашей функции принимать несколько параметров.

Чтобы удалить параметры, вы можете сначала проанализировать URL-адрес с помощью URL конструктора, а затем получить его searchParams свойство. Затем выполните цикл по каждому параметру и используйте URLSearchParams.delete для удаления параметра.

 function removeURLParameters(url, ...parameters) {
    const parsed = new URL(url);
    parameters.forEach(e => parsed.searchParams.delete(e))
    return parsed.toString()
}

const url = "http://localhost:8088/products/10?param1=key1amp;param2=key2amp;param3=key3amp;param4=key4"

const res = removeURLParameters(url, 'param1', 'param3')

console.log(res) 

Комментарии:

1. Я вижу, что возвращение имеет parsed.protocol '//' parsed.host parsed.pathname . Похоже, это относится только к локальному хостингу? что делать, если у меня есть живой веб-сайт?

2. @frankfurt Это будет работать для любого допустимого URL-адреса.

3. А, понятно… я попытался удалить все параметры из этого URL http://localhost:8088/products/10?param1=key1amp;param2=key2amp;param3=key3amp;param4=key4 -адреса , но в конце пути все еще есть»?» http://localhost:8088/products/10? . что делать, если все параметры, удаляющие»?», также исчезли? чтобы URL-адрес выглядел красиво вот так http://localhost:8088/products/10