Javascript 数据将元素属性绑定到 URL 中的锚点 href

Javascript data bind element attribute to anchor href in URL

如何将 location.hash 绑定到 HTML 元素属性?比如下面的元素

<span id="mySpan" data-foo=""></span>

更改为

<span id="mySpan" data-foo="bar"></span>

当 URL 变为 /index.html#bar 时。然后变为

<span id="mySpan" data-foo="buzz"></span>

当 URL 变为 /index.html#buzz 时。

jQuery 是 可接受的 ,但我宁愿在纯 JS 中执行此操作。有什么想法吗?

使用window.onhashchange,像这样

window.onhashchange = function(){

    document.getElementById("mySpan").setAttribute("data-foo",location.hash.slice(1)); 

};