Obtendo o local de hash de URL e usando-o no jQuery

Eu gostaria de obter o valor depois de um hash no URL da página atual e, em seguida, ser capaz de aplicar isso em uma nova function … por exemplo.

O URL pode ser

www.example.com/index.html#foo 

E eu gostaria de usar isso em conjunto com o seguinte trecho de código

 $('ul#foo:first').show(); 

Eu estou meio que assumindo / esperando que haja alguma maneira de pegar isso e transformá-lo em uma variável que eu possa usar no segundo pedaço de código.

Qualquer ajuda será extremamente apreciada!

Felicidades

Nota do editor: a abordagem abaixo tem sérias implicações de segurança e, dependendo da versão do jQuery que você está usando, pode expor seus usuários a ataques XSS. Para obter mais detalhes, consulte a discussão do possível ataque nos comentários sobre essa resposta ou essa explicação no Security Stack Exchange .

Você pode usar a propriedade location.hash para pegar o hash da página atual:

 var hash = window.location.hash; $('ul'+hash+':first').show(); 

Observe que essa propriedade já contém o símbolo # no início.

Na verdade, você não precisa do :first pseudo-seletor, pois está usando o seletor de ID , presume-se que os IDs sejam exclusivos dentro do DOM.

Caso você queira obter o hash de uma string de URL, você pode usar o método String.substring :

 var url = "http://example.com/file.htm#foo"; var hash = url.substring(url.indexOf('#')); // '#foo' 

Conselho: Esteja ciente de que o usuário pode alterar o hash como ele quer, injetando qualquer coisa no seu seletor, você deve verificar o hash antes de usá-lo.

location.hash não é seguro para o IE , no caso do IE (incluindo o IE9), se a sua página contiver iframe, depois da atualização manual dentro do conteúdo do iframe obter o valor location.hash é antigo (valor do carregamento da primeira página). enquanto o valor recuperado manualmente é diferente de location.hash, então sempre o recupere por meio de document.URL

 var hash = document.URL.substr(document.URL.indexOf('#')+1) 

Para quem procura uma solução de javascript pura

  document.getElementById(location.hash.substring(1)).style.display = 'block' 

Espero que isso economize algum tempo.

Eu sugeriria melhor primeiro se a página atual tem um hash. Caso contrário, será undefined .

 $(window).on('load', function(){ if( location.hash && location.hash.length ) { var hash = decodeURIComponent(location.hash.substr(1)); $('ul'+hash+':first').show();; } });