群里看到“如何实现点击刷新页面并同时跳转到本页面指定位置”这么一个提问，于是抽空写了个demo，做了个简单实现，供大家参考。这里有2个要求：
1）要刷新页面
2）跳转到页面指定位置
如果我们简单用a标签name属性，锚点(anchor)来处理的话，只能实现跳转到页面指定位置，而不能刷新。因此，对上述提问，笔者换了下顺序，就比较容易实现了。
1）先跳转到页面指定位置；（用锚点实现即可）
2）再刷新页面；（location.reload(true)即可）
案例代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Location-Anchor</title>
<script src="https://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<style type="text/css">
.box{width: 990px; margin:0 auto 10px; min-height: 400px; border:1px solid #e2e2e2;}
.box .hd{height: 30px; line-height: 30px; font-size: 16px; background:#f5f5f5; padding: 0 15px;}
</style>
</head>
<body>
<div class="box" style='min-height:0;'>
<div class="hd">
<button type="button" onclick="goFloor(1)">Go Floor1</button>
<button type="button" onclick="goFloor(2)">Go Floor2</button>
<button type="button" onclick="goFloor(3)">Go Floor3</button>
<button type="button" onclick="goFloor(4)">Go Floor4</button>
<button type="button" onclick="goFloor(5)">Go Floor5</button>
</div>
</div>
<div class="box">
<div class="hd"><a name="floor1">Floor 1</a></div>
</div>
<div class="box">
<div class="hd"><a name="floor2">Floor 2</a></div>
</div>
<div class="box">
<div class="hd"><a name="floor3">Floor 3</a></div>
</div>
<div class="box">
<div class="hd"><a name="floor4">Floor 4</a></div>
</div>
<div class="box">
<div class="hd"><a name="floor5">Floor 5</a></div>
</div>
<script type="text/javascript">
function goFloor(floor) {
var url = location.href;
url = url.indexOf('#floor') > 0 ? url.replace(/\#floor(\d)/, '#floor' + floor) : url + '#floor' + floor;
location.href = url;
location.reload(true);
}
</script>
</body>
</html>
代码说明：
1）通过设置location.href = url(带#a[name])实现锚点跳转；
2）location.reload(true); 页面重新加载，实现刷新功能；
3）构建带锚点的url，使用了字符串正则替换；
页面是否刷新验证：
1）先跳转到floor3，此时url = …#floor3
2）修改html文件，把<a name=“floor1”>Floor 1</a>改成<a name=“floor1”>Floor 1 refreshed</a>，保存文件
3）点击go floor1按钮，看页面floor1标题是否改成了“Floor 1 refreshed”。