如何使用 jQuery 从 URL 获取锚点？

IT技术 javascript jquery url anchor
2021-01-27 21:45:42

我有一个像这样的网址：

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

如何a_1使用 jQuery获取锚值并将其存储为变量？

6个回答

对于当前窗口，您可以使用：

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

要获取主窗口的哈希值，请使用以下命令：

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

如果您有一个带有 URL/hash 的字符串，最简单的方法是：

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

如果您使用 jQuery，请使用以下命令：

var hash = $(location).attr('hash');
优雅的回答。是否有任何情况下这不起作用？
2021-03-14 21:45:42
@RidIculous 试试这个： $(window).on('hashchange',function(){ $('h1').text(location.hash.slice(1)); });
2021-03-18 21:45:42
如果哈希值可能包含空格或特殊字符，您可能需要添加hash = hash && decodeURI(hash)以获取原始值
2021-03-27 21:45:42
跟踪这种变化的最佳方法是什么，即。有人点击了内页链接？
2021-04-03 21:45:42
快捷版本 -var hash = window.location.hash.substr(1);因为一个 JS 有两个 substr/substring 函数，它们是不同的，但在这种情况下是相同的。
2021-04-06 21:45:42

您可以使用.indexOf()and .substring()，如下所示：

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

您可以在这里尝试一下，如果它可能没有#，请进行如下if(url.indexOf("#") != -1)检查：

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

如果这是当前页面的 URL，您可以使用window.location.hash它来获取它，并根据需要替换它#。

请注意：要从 iFrame 内部获取主窗口的哈希值，您必须window.top.location.hash改为使用。
2021-03-13 21:45:42
url.split("#").pop() - 更慢但更容易。
2021-04-01 21:45:42

利用 

window.location.hash

检索超出并包括 # 的所有内容

location.hash.slice(1)如果您不想在最终字符串中使用哈希标签，请记住使用！
2021-03-27 21:45:42

jQuery 风格：

$(location).attr('hash');
并非每个 javascript 问题都需要使用 jquery 来解决。
2021-03-31 21:45:42
@doxin 我同意，但问题是“如何使用 jQuery 从 URL 获取锚点？”
2021-04-04 21:45:42

您可以使用以下“技巧”来解析任何有效的 URL。它利用了锚元素的特殊 href 相关属性hash。

使用 jQuery

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

用普通的 JS

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
其它你可能感兴趣的问题
上一篇jQuery document.ready 与自调用匿名函数 下一篇如何将 FormData（HTML5 对象）转换为 JSON