HTML刷新页面锚点定位问题
参考贴
https://developer.mozilla.org/zh-CN/docs/Web/API/Performance
https://blog.csdn.net/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
}