HTML刷新页面锚点定位问题

HTML刷新页面锚点定位问题

参考贴
https://developer.mozilla.org/zh-CN/docs/Web/API/Performance
https://blog.youkuaiyun.com/zhouziyu2011/article/details/70673123

如果在a标签的href属性中配置了对应的锚点，那么在刷新当前页面的时候，页面会重新定位到锚点所在的位置

如果要解决此问题，说白就是要，刷新的时候页面回到顶部，并且，清除地址栏的锚点定位

需要用到，window.performance属性

比如地址栏结尾

index.html#product

刷新页面，页面还是定位到product的位置，而且地址栏并没有还原成index.html的状态

先说明

performance.navigation.type

返回一个整数值，表示网页的加载来源，可能有以下4种：

①　0：网页通过点击链接、地址栏输入、表单提交、脚本操作等方式加载，相当于常数performance.navigation.TYPE_NAVIGATENEXT。

②　1：网页通过重新加载按钮或location.reload()方法加载，相当于常数performance.navigation.TYPE_RELOAD。

③　2：网页通过前进或后退按钮加载，相当于常数performance.navigation.TYPE_BACK_FORWARD。

④　255：任何其他来源的加载，相当于常数performance.navigation.TYPE_UNDEFINED。

就目前情况来判断，只考虑type值是否为1的情况，因为是当前页面的刷新情况

    if (window.performance.navigation.type == 1) {
        var thisURL = document.URL;
        if (thisURL.split('#')[1]) {
            var url = thisURL.split('#')[0]
            window.location.replace(url)
        }
    } else {
        // return
    }