window.location.hash 使用说明

当我们使用浏览器地址栏发送请求或者通过JS动态操作URL时，URL中除了问号(?)后的参数，还有一个#hash值。这个hash值可以通过JS的window.location.hash属性获取或者设置。下面让我们看一下window.location.hash的使用说明。

当我们使用浏览器地址栏发送请求或者通过JS动态操作URL时，URL中除了问号(?)后的参数，还有一个#hash值。这个hash值可以通过JS的window.location.hash属性获取或者设置。下面让我们看一下window.location.hash的使用说明。

获取hash值

可以使用window.location.hash属性获取当前页面URL中的hash值。

console.log(window.location.hash); // 打印当前页面的hash值，假如URL是 http://example.com/#about ，那么打印出来的就是 #about

设置hash值

使用window.location.hash属性可以设置hash值，语法是：

window.location.hash = '#new-hash-value';

可以用这种方法实现锚点跳转的效果。

<a href="#about" onclick="window.location.hash = '#about';">Go to about</a>

监听hash值变化

如果需要监听hash值的变化，可以使用window.onhashchange事件。每当URL中的hash值发生变化时，就会触发这个事件。

window.onhashchange = function() {
  console.log('hash changed: ', window.location.hash);
};

在window.onhashchange事件处理函数中，可以获取到当前URL中的hash值。

综上所述，window.location.hash是一个非常有用的属性，它可以帮助我们处理页面的跳转、状态管理等需求。