Prefácio
Primeiro, precisamos saber o que é a pesquisa. A pesquisa é uma propriedade do Window.Location. Por exemplo:
Primeiro de tudo, temos um URL aqui, que é http://www.a.com/list/2.html?page=2&color=4&size=3#pic.
Quando acessarmos este endereço, abra o console, digite Window.Location e obteremos o resultado na figura a seguir
Como mencionado acima, o que queremos operar é a parte da caixa na figura acima.
Por que você precisa operar isso?
Por exemplo, se eu precisar pular para a terceira página na segunda página, preciso atualizar a página acima = 2 para a página = 3 e garantir que outros parâmetros sejam retidos.
Ou, não houve resultado de pesquisa no início (como a primeira página da lista geral, não havia nada), mas agora preciso adicionar página = 2.
Em seguida, preciso saber em qual página estou agora, ou seja, preciso obter o valor da página.
Portanto, a pesquisa é necessária. Agora estamos separados das extremidades dianteiras e traseiras, a pesquisa é um método muito importante para a configuração de parâmetros.
Método de construção
Obtenha um valor de parâmetro especificado na pesquisa
Pegue o Baidu e encontramos o seguinte método:
função getQueryString (nome) {var reg = new regexp ("(^| &)" + name + "= ([^&]*) (& | $)"); var r = window.Location.Search.substr (1) .match (reg); if (r! = null) retornar (r! retornar nulo;}Método Fonte: Método para obter parâmetros de barra de endereço usando JS
Método de função completa
Originalmente, eu queria escrever uma ideia de implementação, mas não consegui me lembrar por um tempo, então eu entreguei diretamente ao método final:
function funcurl (nome, valor, tipo) {var loca = window.Location; var Baseurl = type == indefinido? loca.origin + loca.pathname + "?" : ""; var query = loca.search.substr (1); // Se não houver transmissão de parâmetros, o valor da pesquisa de retorno não contém um ponto de interrogação se (nome == indefinido) {retorna consulta} // se não houver um valor de transmissão, retornar o valor do parâmetro a ser consulta se (value == "(varca) +"= ([^&]*) (& | $)")); retornar val! = nulo? descendente (val [2]): null;}; var url; if (query == "") {// Se não houver valor de pesquisa, retorne o urlurl com o parâmetro anexado = baseurl + nome + "=" + value;} else {// se não houver valor de pesquisa, modificar o valor correspondente = »{}} mais {// se não houver um valor de pesquisa, o valor de isto (eDuplicle; query.split ("&"); para (var i = 0; i <arr.length; i ++) {arr [i] = arr [i] .split ("="); obj [arr [i] [0]] = arr [i] [1];}; obj [name] = valor; url = baseurl+ Json.Stringify (OBJ) .Place (/[/"/{/}]/g," "). Substitua (//:/g," = "). Substituir (//,/g," & ");}; retornar url;}Como usar
funcurl () recebe o valor completo de pesquisa (sem incluir pontos de interrogação)
funcurl (nome) retorna o valor do nome em URL (integra o parágrafo anterior dos métodos de outras pessoas)
Funcurl (nome, valor) Defina o valor do nome em pesquisa para valorizar e retornar o URL completo
Retorne conteúdo como http://www.a.com/list/2.html?page=2&color=4&size=3#pic
funcurl (nome, valor, tipo) funciona o mesmo que o terceiro item, mas isso retorna apenas a string de pesquisa atualizada
O tipo aqui pode ser qualquer personagem, como 1;
Retornar conteúdo exemplo página = 2 & cor = 4 & size = 3;
Geralmente usado para obter parâmetros do URL e depois atracar na interface
resumo
Originalmente, eu queria encontrar um plug-in pronto para usar, mas era grande demais para entender ou não ser fácil de usar. Claro, foi principalmente porque meu nível era muito ruim.
Então eu fiz uma roda para brincar com ela. Embora o código não seja elegante o suficiente, ele ainda atende às minhas necessidades. Se você tiver sugestões melhores, deixe -me uma mensagem.
De fato, é usado principalmente com o Vue, mas não há conteúdo de vue aqui, por isso não é considerado uma série de tutoriais para o Vue.
O exposto acima é a descrição completa de alguns métodos e funções de pesquisa no JavaScript Operação URL introduzida a você pelo editor. Espero que seja útil para você. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a você a tempo. Muito obrigado pelo seu apoio ao site wulin.com!