Analisando o hash / fragment de URL com JavaScript

Procurando uma maneira de analisar pares de chaves fora do hash / fragment de uma URL em um object / matriz associativa com JavaScript / JQuery

Confira: jQuery BBQ

jQuery BBQ é projetado para analisar coisas da url (query string ou fragment), e vai um pouco mais para simplificar o histórico baseado em fragments. Este é o plugin do jQuery que Yarin estava procurando antes de montar uma solução js pura. Especificamente, a function deparam.fragment () faz o trabalho. Dar uma olhada!

(O site de suporte em que estou trabalhando usa uma pesquisa assíncrona e, como o BBQ torna trivial colocar objects inteiros no fragment, eu o uso para “persistir” nos meus parâmetros de pesquisa. Isso fornece aos usuários históricos para suas pesquisas e também permite que eles marquem pesquisas úteis. O melhor de tudo é que, quando o controle de qualidade encontra um defeito de pesquisa, ele pode vincular diretamente aos resultados problemáticos!)

Aqui está, modificado a partir desse analisador de string de consulta :

function getHashParams() { var hashParams = {}; var e, a = /\+/g, // Regex for replacing addition symbol with a space r = /([^&;=]+)=?([^&;]*)/g, d = function (s) { return decodeURIComponent(s.replace(a, " ")); }, q = window.location.hash.substring(1); while (e = r.exec(q)) hashParams[d(e[1])] = d(e[2]); return hashParams; } 

Não é necessário JQuery / plug-in

Atualizar:

Agora estou recomendando o plugin jQuery para churrasco , de acordo com a resposta de Hovis. Abrange todos os problemas de análise de hash.

Faça isso em Javascript puro:

 var hash = window.location.hash.substr(1); var result = hash.split('&').reduce(function (result, item) { var parts = item.split('='); result[parts[0]] = parts[1]; return result; }, {}); 

Eu estou usando a biblioteca do analisador de URL do jQuery .

Eu estava olhando através de um monte de respostas para este problema e acabou juntando-as usando uma linha com reduce :

 const hashObj = location.hash.replace('#', '').split('&').reduce((prev, item) => Object.assign({[item.split('=')[0]]: item.split('=')[1]}, prev), {}); 

Há obviamente muita coisa acontecendo nessa linha. Pode ser reescrito assim para esclarecimentos:

 const hashObj = location.hash.replace('#', '').split('&').reduce((prev, item) => { return Object.assign({[item.split('=')[0]]: item.split('=')[1]}, prev); }, {}); 

Minha resposta a esta pergunta deve fazer o que você está procurando:

 url_args_decode = function (url) { var args_enc, el, i, nameval, ret; ret = {}; // use the DOM to parse the URL via an 'a' element el = document.createElement("a"); el.href = url; // strip off initial ? on search and split args_enc = el.search.substring(1).split('&'); for (i = 0; i < args_enc.length; i++) { // convert + into space, split on =, and then decode args_enc[i].replace(/\+/g, ' '); nameval = args_enc[i].split('=', 2); ret[decodeURIComponent(nameval[0])]=decodeURIComponent(nameval[1]); } return ret; }; 

Você também pode usar a propriedade .hash, demonstrada neste exemplo de tabela de conteúdo de rolagem para um link clicado ou para o local .

Essa API jquery faz a análise de hash tags: https://jhash.codeplex.com/

 // get the "name" querystring value var n = jHash.val('name'); // get the "location" querystring value var l = jHash.val('location'); // set some querystring values jHash.val({ name: 'Chris', location: 'WI' }); 

Você pode querer dar uma olhada no jsuri . Parece funcionar bem para mim.