Como obter a âncora da URL usando o jQuery?

184

Eu tenho um URL que é como:

www.example.com/task1/1.3.html#a_1

Como posso obter o a_1valor âncora usando jQuery e armazená-lo como uma variável?

— zjm1126
fonte

207

Você pode usar o .indexOf()e .substring(), assim:

var url = "www.aaa.com/task1/1.3.html#a_1";
var hash = url.substring(url.indexOf("#")+1);

Você pode experimentá-lo aqui , se não houver um #, faça uma if(url.indexOf("#") != -1)verificação como esta:

var url = "www.aaa.com/task1/1.3.html#a_1", idx = url.indexOf("#");
var hash = idx != -1 ? url.substring(idx+1) : "";

Se esse for o URL da página atual , você pode simplesmente usá window.location.hash-lo e substituí-lo, #se desejar.

— Nick Craver
fonte

10

Observe: para obter o valor do hash da janela principal de dentro de um iFrame, você deve usá-lo window.top.location.hash.

— Paolo Stefan

1

url.split("#").pop() - Mais lento, mas mais fácil.

— Ifch0o1 01/02/19

490

Para a janela atual , você pode usar isto:

var hash = window.location.hash.substr(1);

Para obter o valor do hash da janela principal , use o seguinte:

var hash = window.top.location.hash.substr(1);

Se você possui uma string com um URL / hash, o método mais fácil é:

var url = 'https://www.stackoverflow.com/questions/123/abc#10076097';
var hash = url.split('#').pop();

Se você estiver usando jQuery, use o seguinte:

var hash = $(location).attr('hash');

— Silvio Delgado
fonte

1

Resposta elegante. Existem casos em que isso não funciona?

— Sscirrus 27/05

2

versão de atalho - var hash = window.location.hash.substr(1);por causa de um JS ter ambas as funções substr / substring, elas são diferentes, mas, neste caso, as mesmas.

— Arthur Kushman

qual é a melhor maneira de acompanhar as mudanças disso, ie. alguém clicou em um link da página interna?

— Rid Iculous

5

@RidIculous tente isso: $ (window) .on ('hashchange', function () {$ ('h1'). Text (location.hash.slice (1));});

— Silvio Delgado

71

Usar

window.location.hash

para recuperar tudo além e incluindo o #

— Real
fonte

15

Lembre- location.hash.slice(1)se de usar se você não quiser a tag hash na string final!

— 23713 Sandy Gifford

39

estilo jQuery:

$(location).attr('hash');

— Namorados
fonte

7

nem todo problema javascript precisa ser resolvido com o jquery.

— Doxin

22

@doxin Concordo, mas a pergunta é "Como obter a âncora a partir da URL usando o jQuery?"

— Valentin E

10

Você pode usar o seguinte "truque" para analisar qualquer URL válido. Aproveita a propriedade especial relacionada ao href do elemento anchorhash ,.

Com jQuery

function getHashFromUrl(url){
    return $("<a />").attr("href", url)[0].hash.replace(/^#/, "");
}
getHashFromUrl("www.example.com/task1/1.3.html#a_1"); // a_1

Com JS simples

function getHashFromUrl(url){
    var a = document.createElement("a");
    a.href = url;
    return a.hash.replace(/^#/, "");
};
getHashFromUrl("www.example.com/task1/1.3.html#a_1"); // a_1

— David Murdoch
fonte

3

Se você apenas possui uma string de URL simples (e, portanto, não possui um atributo hash), também pode usar uma expressão regular:

var url = "www.example.com/task1/1.3.html#a_1"  
var anchor = url.match(/#(.*)/)[1]

— DrewB
fonte

1

É necessário verificar se a correspondência obtém resultados antes de acessar o segundo elemento dela, ou esse código ocorrerá erro se o URL não tiver âncora.

— Richard Garside